wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

feat: refs #7553 ticket component to vntable and fixed minor errors

This commit is contained in:
Jon Elias 2024-09-06 13:59:50 +02:00
parent e962063753
commit 0e5607d685
5 changed files with 338 additions and 366 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

151
src/pages/Ticket/Card/BasicData/TicketBasicData.vue
View File

@ -4,7 +4,6 @@ import { useI18n } from 'vue-i18n';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import FetchedTags from 'components/ui/FetchedTags.vue'; import FetchedTags from 'components/ui/FetchedTags.vue';
import RightMenu from 'src/components/common/RightMenu.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
@ -145,83 +144,81 @@ onUnmounted(() => (stateStore.rightDrawer = false));
@on-fetch="(data) => (ticketUpdateActions = data)" @on-fetch="(data) => (ticketUpdateActions = data)"
auto-load auto-load
/> />
<RightMenu> <QDrawer side="right" :width="270" v-model="stateStore.rightDrawer">
<template #right-panel> <QCard
<QCard class="q-pa-md q-mb-md q-ma-md color-vn-text"
class="q-pa-md q-mb-md q-ma-md color-vn-text" bordered
bordered flat
flat style="border-color: black"
style="border-color: black" >
<QCardSection horizontal>
<span class="text-weight-bold text-subtitle1 text-center full-width">
{{ t('basicData.total') }}
</span>
</QCardSection>
<QCardSection class="column items-center" horizontal>
<span>
{{ t('basicData.price') }}:
{{ toCurrency(totalPrice) }}
</span>
</QCardSection>
<QCardSection class="column items-center" horizontal>
<span>
{{ t('basicData.newPrice') }}: {{ toCurrency(totalNewPrice) }}
</span>
</QCardSection>
<QCardSection class="column items-center" horizontal>
<span>
{{ t('basicData.difference') }}: {{ toCurrency(totalDifference) }}
</span>
</QCardSection>
</QCard>
<QCard
v-if="totalDifference"
class="q-pa-md q-mb-md q-ma-md color-vn-text"
bordered
flat
style="border-color: black"
>
<QCardSection horizontal>
<span class="text-weight-bold text-subtitle1 text-center full-width">
{{ t('basicData.chargeDifference') }}
</span>
</QCardSection>
<QCardSection
v-for="(action, index) in ticketUpdateActions"
:key="index"
horizontal
> >
<QCardSection horizontal> <QRadio
<span class="text-weight-bold text-subtitle1 text-center full-width"> v-model="_ticketData.option"
{{ t('basicData.total') }} :val="action.code"
</span> :label="action.description"
</QCardSection> dense
<QCardSection class="column items-center" horizontal> />
<span> </QCardSection>
{{ t('basicData.price') }}: </QCard>
{{ toCurrency(totalPrice) }} <QCard
</span> v-if="haveNegatives"
</QCardSection> class="q-pa-md q-mb-md q-ma-md color-vn-text"
<QCardSection class="column items-center" horizontal> bordered
<span> flat
{{ t('basicData.newPrice') }}: {{ toCurrency(totalNewPrice) }} style="border-color: black"
</span> >
</QCardSection> <QCardSection horizontal class="flex row items-center">
<QCardSection class="column items-center" horizontal> <QCheckbox
<span> :label="t('basicData.withoutNegatives')"
{{ t('basicData.difference') }}: {{ toCurrency(totalDifference) }} v-model="_ticketData.withoutNegatives"
</span> :toggle-indeterminate="false"
</QCardSection> />
</QCard> <QIcon name="info" size="xs" class="q-ml-sm">
<QCard <QTooltip max-width="350px">
v-if="totalDifference" {{ t('basicData.withoutNegativesInfo') }}
class="q-pa-md q-mb-md q-ma-md color-vn-text" </QTooltip>
bordered </QIcon>
flat </QCardSection>
style="border-color: black" </QCard>
> </QDrawer>
<QCardSection horizontal>
<span class="text-weight-bold text-subtitle1 text-center full-width">
{{ t('basicData.chargeDifference') }}
</span>
</QCardSection>
<QCardSection
v-for="(action, index) in ticketUpdateActions"
:key="index"
horizontal
>
<QRadio
v-model="_ticketData.option"
:val="action.code"
:label="action.description"
dense
/>
</QCardSection>
</QCard>
<QCard
v-if="haveNegatives"
class="q-pa-md q-mb-md q-ma-md color-vn-text"
bordered
flat
style="border-color: black"
>
<QCardSection horizontal class="flex row items-center">
<QCheckbox
:label="t('basicData.withoutNegatives')"
v-model="_ticketData.withoutNegatives"
:toggle-indeterminate="false"
/>
<QIcon name="info" size="xs" class="q-ml-sm">
<QTooltip max-width="350px">
{{ t('basicData.withoutNegativesInfo') }}
</QTooltip>
</QIcon>
</QCardSection>
</QCard>
</template>
</RightMenu>
<QTable <QTable
:visible-columns="showMovablecolumn" :visible-columns="showMovablecolumn"
:rows="rows" :rows="rows"

353
src/pages/Ticket/Card/TicketComponents.vue
View File

@ -5,15 +5,16 @@ import { useRoute } from 'vue-router';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import FetchedTags from 'components/ui/FetchedTags.vue'; import FetchedTags from 'components/ui/FetchedTags.vue';
import RightMenu from 'src/components/common/RightMenu.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue'; import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
import VnImg from 'src/components/ui/VnImg.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { dashIfEmpty } from 'src/filters'; import { dashIfEmpty } from 'src/filters';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import { toCurrency } from 'filters/index'; import { toCurrency } from 'filters/index';
import axios from 'axios'; import axios from 'axios';
import VnTable from 'src/components/VnTable/VnTable.vue';
const route = useRoute(); const route = useRoute();
const stateStore = useStateStore(); const stateStore = useStateStore();
@ -75,32 +76,39 @@ const columns = computed(() => [
name: 'item', name: 'item',
align: 'left', align: 'left',
}, },
{
align: 'left',
label: t('lines.image'),
name: 'image',
columnField: {
component: VnImg,
attrs: (id) => {
return {
id,
width: '50px',
};
},
},
columnFilter: false,
},
{ {
label: t('ticketComponents.description'), label: t('ticketComponents.description'),
name: 'description', name: 'description',
align: 'left', align: 'left',
columnClass: 'expand',
}, },
{ {
label: t('ticketComponents.quantity'), label: t('ticketComponents.quantity'),
name: 'quantity', name: 'quantity',
field: 'quantity', field: 'quantity',
align: 'left', align: 'left',
format: (val) => dashIfEmpty(val), format: (row) => dashIfEmpty(row.quantity),
}, },
{ {
label: t('ticketComponents.serie'), label: t('ticketComponents.serie'),
name: 'serie', name: 'serie',
align: 'left', align: 'left',
}, format: (row) => dashIfEmpty(row.serie),
{
label: t('ticketComponents.components'),
name: 'components',
align: 'left',
},
{
label: t('ticketComponents.import'),
name: 'import',
align: 'left',
}, },
{ {
label: t('ticketComponents.total'), label: t('ticketComponents.total'),
@ -174,181 +182,166 @@ onUnmounted(() => (stateStore.rightDrawer = false));
@on-fetch="(data) => (components = data)" @on-fetch="(data) => (components = data)"
auto-load auto-load
/> />
<RightMenu> <QDrawer side="right" :width="270" v-model="stateStore.rightDrawer">
<template #right-panel> <QCard class="q-pa-sm color-vn-text" bordered flat style="border-color: black">
<QCard <QCardSection horizontal>
class="q-pa-sm color-vn-text" <span class="text-weight-bold text-subtitle1 text-center full-width">
bordered {{ t('ticketComponents.total') }}
flat </span>
style="border-color: black" </QCardSection>
<QCardSection horizontal>
<span class="q-mr-xs color-vn-label"
>{{ t('ticketComponents.baseToCommission') }}:
</span>
<span>{{ toCurrency(getBase) }}</span>
</QCardSection>
<QCardSection horizontal>
<span class="q-mr-xs color-vn-label"
>{{ t('ticketComponents.totalWithoutVat') }}:
</span>
<span>{{ toCurrency(getTotal) }}</span>
</QCardSection>
</QCard>
<QCard class="q-pa-sm color-vn-text" bordered flat style="border-color: black">
<QCardSection horizontal>
<span class="text-weight-bold text-subtitle1 text-center full-width">
{{ t('ticketComponents.components') }}
</span>
</QCardSection>
<QCardSection
v-for="(component, index) in componentsList"
:key="index"
horizontal
> >
<QCardSection horizontal> <span v-if="component.name" class="q-mr-xs color-vn-label">
<span class="text-weight-bold text-subtitle1 text-center full-width"> {{ component.name }}:
{{ t('ticketComponents.total') }} </span>
</span> <span v-if="component.value">{{
</QCardSection> toCurrency(component.value, 'EUR', 3)
<QCardSection horizontal> }}</span>
<span class="q-mr-xs color-vn-label" </QCardSection>
>{{ t('ticketComponents.baseToCommission') }}: </QCard>
</span> <QCard class="q-pa-sm color-vn-text" bordered flat style="border-color: black">
<span>{{ toCurrency(getBase) }}</span> <QCardSection horizontal>
</QCardSection> <span class="text-weight-bold text-subtitle1 text-center full-width">
<QCardSection horizontal> {{ t('ticketComponents.zoneBreakdown') }}
<span class="q-mr-xs color-vn-label" </span>
>{{ t('ticketComponents.totalWithoutVat') }}: </QCardSection>
</span> <QCardSection horizontal>
<span>{{ toCurrency(getTotal) }}</span> <span class="q-mr-xs color-vn-label">
</QCardSection> {{ t('ticketComponents.price') }}:
</QCard> </span>
<QCard <span>{{ toCurrency(ticketData?.zonePrice, 'EUR', 2) }}</span>
class="q-pa-sm color-vn-text" </QCardSection>
bordered <QCardSection horizontal>
flat <span class="q-mr-xs color-vn-label">
style="border-color: black" {{ t('ticketComponents.bonus') }}:
> </span>
<QCardSection horizontal> <span>{{ toCurrency(ticketData?.zoneBonus, 'EUR', 2) }}</span>
<span class="text-weight-bold text-subtitle1 text-center full-width"> </QCardSection>
{{ t('ticketComponents.components') }} <QCardSection horizontal>
</span> <span class="q-mr-xs color-vn-label">
</QCardSection> {{ t('ticketComponents.zone') }}:
<QCardSection </span>
v-for="(component, index) in componentsList" <span class="link">
:key="index" {{ dashIfEmpty(ticketData?.zone?.name) }}
horizontal <ZoneDescriptorProxy :id="ticketData?.zone?.id" />
> </span>
<span v-if="component.name" class="q-mr-xs color-vn-label"> </QCardSection>
{{ component.name }}: <QCardSection v-if="ticketData?.zone?.isVolumetric" horizontal>
</span> <span class="q-mr-xs color-vn-label">
<span v-if="component.value">{{ {{ t('ticketComponents.volume') }}:
toCurrency(component.value, 'EUR', 3) </span>
}}</span> <span>{{ ticketVolume }}</span>
</QCardSection> </QCardSection>
</QCard> <QCardSection horizontal>
<QCard <span class="q-mr-xs color-vn-label">
class="q-pa-sm color-vn-text" {{ t('ticketComponents.packages') }}:
bordered </span>
flat <span>{{ dashIfEmpty(ticketData?.packages) }}</span>
style="border-color: black" </QCardSection>
> </QCard>
<QCardSection horizontal> <QCard class="q-pa-sm color-vn-text" bordered flat style="border-color: black">
<span class="text-weight-bold text-subtitle1 text-center full-width"> <QCardSection horizontal>
{{ t('ticketComponents.zoneBreakdown') }} <span class="text-weight-bold text-subtitle1 text-center full-width">
</span> {{ t('ticketComponents.theoricalCost') }}
</QCardSection> </span>
<QCardSection horizontal> </QCardSection>
<span class="q-mr-xs color-vn-label"> <QCardSection horizontal>
{{ t('ticketComponents.price') }}: <span class="q-mr-xs color-vn-label">
</span> {{ t('ticketComponents.totalPrice') }}:
<span>{{ toCurrency(ticketData?.zonePrice, 'EUR', 2) }}</span> </span>
</QCardSection> <span>{{ toCurrency(theoricalCost, 'EUR', 2) }}</span>
<QCardSection horizontal> </QCardSection>
<span class="q-mr-xs color-vn-label"> </QCard>
{{ t('ticketComponents.bonus') }}: </QDrawer>
</span> <VnTable
<span>{{ toCurrency(ticketData?.zoneBonus, 'EUR', 2) }}</span> ref="tableRef"
</QCardSection> data-key="TicketComponents"
<QCardSection horizontal> url="Sales"
<span class="q-mr-xs color-vn-label"> :user-filter="salesFilter"
{{ t('ticketComponents.zone') }}:
</span>
<span class="link">
{{ dashIfEmpty(ticketData?.zone?.name) }}
<ZoneDescriptorProxy :id="ticketData?.zone?.id" />
</span>
</QCardSection>
<QCardSection v-if="ticketData?.zone?.isVolumetric" horizontal>
<span class="q-mr-xs color-vn-label">
{{ t('ticketComponents.volume') }}:
</span>
<span>{{ ticketVolume }}</span>
</QCardSection>
<QCardSection horizontal>
<span class="q-mr-xs color-vn-label">
{{ t('ticketComponents.packages') }}:
</span>
<span>{{ dashIfEmpty(ticketData?.packages) }}</span>
</QCardSection>
</QCard>
<QCard
class="q-pa-sm color-vn-text"
bordered
flat
style="border-color: black"
>
<QCardSection horizontal>
<span class="text-weight-bold text-subtitle1 text-center full-width">
{{ t('ticketComponents.theoricalCost') }}
</span>
</QCardSection>
<QCardSection horizontal>
<span class="q-mr-xs color-vn-label">
{{ t('ticketComponents.totalPrice') }}:
</span>
<span>{{ toCurrency(theoricalCost, 'EUR', 2) }}</span>
</QCardSection>
</QCard>
</template>
</RightMenu>
<QTable
:rows="components"
:columns="columns" :columns="columns"
row-key="id" :right-search="false"
:pagination="{ rowsPerPage: 0 }" auto-load
class="full-width q-mt-md" :disable-option="{ card: true }"
:no-data-label="t('globals.noResults')" :column-search="false"
> >
<template #body-cell-item="{ row }"> <template #column-item="{ row }">
<QTd @click.stop class="link"> <span @click.stop flat class="link">
<QBtn flat> {{ row.itemFk }}
<span>{{ row.itemFk }}</span> <ItemDescriptorProxy :id="row.itemFk" />
<ItemDescriptorProxy :id="row.itemFk" /> </span>
</QBtn>
</QTd>
</template> </template>
<template #body-cell-description="{ row }"> <template #column-image="{ row }">
<QTd> <div class="image-wrapper">
<div class="column"> <VnImg :id="parseInt(row?.item?.id)" class="rounded" />
<span>{{ row.item.name }}</span> </div>
<span class="color-vn-label">{{ row.item.subName }}</span>
<FetchedTags :item="row.item" />
</div>
</QTd>
</template> </template>
<template #body-cell-serie="{ row }"> <template #column-description="{ row }">
<QTd> <div class="column">
<div class="column"> <span>{{ row.item.name }}</span>
<span v-for="(saleComponent, index) in row.components" :key="index"> <span class="color-vn-label">{{ row.item.subName }}</span>
{{ saleComponent.component?.componentType?.name }} <FetchedTags :item="row.item" />
</span> </div>
</div>
</QTd>
</template> </template>
<template #body-cell-components="{ row }"> <template #column-serie="{ row }">
<QTd> <div class="column">
<div class="column"> <span v-for="(saleComponent, index) in row.components" :key="index">
<span v-for="(saleComponent, index) in row.components" :key="index"> {{ saleComponent.component?.componentType?.name }}
{{ saleComponent.component?.name }} </span>
</span> </div>
</div>
</QTd>
</template> </template>
<template #body-cell-import="{ row }"> <!-- <template #column-components="{ row }">
<QTd> <div class="column">
<div class="column text-right"> <span v-for="(saleComponent, index) in row.components" :key="index">
<span v-for="(saleComponent, index) in row.components" :key="index"> {{ saleComponent.component?.name }}
</span>
</div>
</template> -->
<!-- <template #column-import="{ row }">
<div class="column text-left">
<span v-for="(saleComponent, index) in row.components" :key="index">
{{ toCurrency(saleComponent.value, 'EUR', 3) }}
</span>
</div>
</template> -->
<template #column-total="{ row }">
<div class="column">
<span v-for="(saleComponent, index) in row.components" :key="index">
{{ toCurrency(saleComponent.value * row.quantity, 'EUR', 3) }}
<QTooltip>
{{ saleComponent.component?.name }}:
{{ toCurrency(saleComponent.value, 'EUR', 3) }} {{ toCurrency(saleComponent.value, 'EUR', 3) }}
</span> </QTooltip>
</div> </span>
</QTd> </div>
</template> </template>
<template #body-cell-total="{ row }"> </VnTable>
<QTd>
<div class="column text-right">
<span v-for="(saleComponent, index) in row.components" :key="index">
{{ toCurrency(saleComponent.value * row.quantity, 'EUR', 3) }}
</span>
</div>
</QTd>
</template>
</QTable>
</template> </template>
<style lang="scss" scoped>
.image-wrapper {
width: 40px;
height: 40px;
}
</style>

15
src/pages/Ticket/Card/TicketPurchaseRequest.vue
View File

@ -14,8 +14,11 @@ import VnSelect from 'src/components/common/VnSelect.vue';
import FetchData from 'src/components/FetchData.vue'; import FetchData from 'src/components/FetchData.vue';
import { useVnConfirm } from 'composables/useVnConfirm'; import { useVnConfirm } from 'composables/useVnConfirm';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
import { onMounted } from 'vue';
import { useStateStore } from 'src/stores/useStateStore';
const route = useRoute(); const route = useRoute();
const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const tableRef = ref(); const tableRef = ref();
const attendersOptions = ref([]); const attendersOptions = ref([]);
@ -84,14 +87,12 @@ const columns = computed(() => [
condition: () => true, condition: () => true,
}, },
isId: true, isId: true,
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('purchaseRequest.description'), label: t('purchaseRequest.description'),
name: 'description', name: 'description',
columnClass: 'expand', columnClass: 'expand',
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -99,7 +100,6 @@ const columns = computed(() => [
name: 'created', name: 'created',
format: (row) => toDateFormat(row.created), format: (row) => toDateFormat(row.created),
cardVisible: true, cardVisible: true,
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -107,7 +107,6 @@ const columns = computed(() => [
name: 'requesterFk', name: 'requesterFk',
cardVisible: true, cardVisible: true,
format: (row) => dashIfEmpty(row.requester?.user?.nickname), format: (row) => dashIfEmpty(row.requester?.user?.nickname),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -115,33 +114,28 @@ const columns = computed(() => [
name: 'attenderFk', name: 'attenderFk',
cardVisible: true, cardVisible: true,
format: (row) => dashIfEmpty(row.atender?.user?.nickname), format: (row) => dashIfEmpty(row.atender?.user?.nickname),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('purchaseRequest.quantity'), label: t('purchaseRequest.quantity'),
name: 'quantity', name: 'quantity',
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('purchaseRequest.price'), label: t('purchaseRequest.price'),
name: 'price', name: 'price',
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('purchaseRequest.saleFk'), label: t('purchaseRequest.saleFk'),
name: 'saleFk', name: 'saleFk',
cardVisible: true, cardVisible: true,
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('purchaseRequest.state'), label: t('purchaseRequest.state'),
name: 'isOk', name: 'isOk',
cardVisible: true, cardVisible: true,
isHidden: true,
}, },
{ {
align: 'right', align: 'right',
@ -186,6 +180,8 @@ async function removeLine(id) {
console.error('Error ', err); console.error('Error ', err);
} }
} }
onMounted(() => (stateStore.rightDrawer = false));
</script> </script>
<template> <template>
@ -212,6 +208,7 @@ async function removeLine(id) {
:columns="columns" :columns="columns"
:is-editable="true" :is-editable="true"
:right-search="false" :right-search="false"
:column-search="false"
auto-load auto-load
> >
<template #column-description="{ row }"> <template #column-description="{ row }">

181
src/pages/Ticket/Card/TicketSale.vue
View File

@ -63,7 +63,6 @@ const columns = computed(() => [
{ {
align: 'left', align: 'left',
name: 'statusIcons', name: 'statusIcons',
hidden: true,
}, },
{ {
align: 'center', align: 'center',
@ -85,20 +84,17 @@ const columns = computed(() => [
label: t('ticketSale.visible'), label: t('ticketSale.visible'),
name: 'visible', name: 'visible',
format: (row, dashIfEmpty) => dashIfEmpty(row.visible), format: (row, dashIfEmpty) => dashIfEmpty(row.visible),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('ticketSale.available'), label: t('ticketSale.available'),
name: 'available', name: 'available',
format: (row, dashIfEmpty) => dashIfEmpty(row.available), format: (row, dashIfEmpty) => dashIfEmpty(row.available),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('ticketSale.id'), label: t('ticketSale.id'),
name: 'itemFk', name: 'itemFk',
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -106,7 +102,6 @@ const columns = computed(() => [
name: 'quantity', name: 'quantity',
cardVisible: true, cardVisible: true,
format: (row) => toCurrency(row.quantity), format: (row) => toCurrency(row.quantity),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -115,7 +110,6 @@ const columns = computed(() => [
format: (row) => row?.item?.name, format: (row) => row?.item?.name,
columnClass: 'expand', columnClass: 'expand',
cardVisible: true, cardVisible: true,
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -123,7 +117,6 @@ const columns = computed(() => [
name: 'price', name: 'price',
cardVisible: true, cardVisible: true,
format: (row) => toCurrency(row.price), format: (row) => toCurrency(row.price),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -131,14 +124,12 @@ const columns = computed(() => [
name: 'discount', name: 'discount',
cardVisible: true, cardVisible: true,
format: (row) => toPercentage(row.discount), format: (row) => toPercentage(row.discount),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
label: t('ticketSale.amount'), label: t('ticketSale.amount'),
name: 'amount', name: 'amount',
format: (row) => parseInt(row.amount * row.quantity), format: (row) => parseInt(row.amount * row.quantity),
hidden: true,
}, },
{ {
align: 'left', align: 'left',
@ -146,7 +137,6 @@ const columns = computed(() => [
name: 'itemPackingTypeFk', name: 'itemPackingTypeFk',
cardVisible: true, cardVisible: true,
format: (row, dashIfEmpty) => dashIfEmpty(row?.item?.itemPackingTypeFk), format: (row, dashIfEmpty) => dashIfEmpty(row?.item?.itemPackingTypeFk),
hidden: true,
}, },
{ {
align: 'right', align: 'right',
@ -578,52 +568,51 @@ async function save(item) {
selection: 'multiple', selection: 'multiple',
}" }"
:right-search="false" :right-search="false"
:column-search="false"
auto-load auto-load
> >
<template #column-statusIcons="{ row }"> <template #column-statusIcons="{ row }">
<QTd class="q-gutter-x-xs"> <router-link
<router-link v-if="row.claim?.claimFk"
v-if="row.claim?.claimFk" :to="{ name: 'ClaimBasicData', params: { id: row.claim?.claimFk } }"
:to="{ name: 'ClaimBasicData', params: { id: row.claim?.claimFk } }" >
> <QIcon color="primary" name="vn:claims" size="xs">
<QIcon color="primary" name="vn:claims" size="xs">
<QTooltip>
{{ t('ticketSale.claim') }}:
{{ row.claim?.claimFk }}
</QTooltip>
</QIcon>
</router-link>
<QIcon v-if="row.visible < 0" color="primary" name="warning" size="xs">
<QTooltip> <QTooltip>
{{ t('ticketSale.visible') }}: {{ row.visible || 0 }} {{ t('ticketSale.claim') }}:
{{ row.claim?.claimFk }}
</QTooltip> </QTooltip>
</QIcon> </QIcon>
<QIcon v-if="row.reserved" color="primary" name="vn:reserva" size="xs"> </router-link>
<QTooltip> <QIcon v-if="row.visible < 0" color="primary" name="warning" size="xs">
{{ t('ticketSale.reserved') }} <QTooltip>
</QTooltip> {{ t('ticketSale.visible') }}: {{ row.visible || 0 }}
</QIcon> </QTooltip>
<QIcon </QIcon>
v-if="row.itemShortage" <QIcon v-if="row.reserved" color="primary" name="vn:reserva" size="xs">
color="primary" <QTooltip>
name="vn:unavailable" {{ t('ticketSale.reserved') }}
size="xs" </QTooltip>
> </QIcon>
<QTooltip> <QIcon
{{ t('ticketSale.noVisible') }} v-if="row.itemShortage"
</QTooltip> color="primary"
</QIcon> name="vn:unavailable"
<QIcon size="xs"
v-if="row.hasComponentLack" >
color="primary" <QTooltip>
name="vn:components" {{ t('ticketSale.noVisible') }}
size="xs" </QTooltip>
> </QIcon>
<QTooltip> <QIcon
{{ t('ticketSale.hasComponentLack') }} v-if="row.hasComponentLack"
</QTooltip> color="primary"
</QIcon> name="vn:components"
</QTd> size="xs"
>
<QTooltip>
{{ t('ticketSale.hasComponentLack') }}
</QTooltip>
</QIcon>
</template> </template>
<template #column-image="{ row }"> <template #column-image="{ row }">
<div class="image-wrapper"> <div class="image-wrapper">
@ -677,59 +666,53 @@ async function save(item) {
</VnSelect> </VnSelect>
</template> </template>
<template #column-quantity="{ row }"> <template #column-quantity="{ row }">
<QTd @click.stop> <VnInput
<VnInput v-if="isTicketEditable"
v-if="isTicketEditable" v-model.number="row.quantity"
v-model.number="row.quantity" @keyup.enter="changeQuantity(row)"
@keyup.enter="changeQuantity(row)" @blur="changeQuantity(row)"
@blur="changeQuantity(row)" @focus="edit.oldQuantity = row.quantity"
@focus="edit.oldQuantity = row.quantity" />
/> <span v-else>{{ row.quantity }}</span>
<span v-else>{{ row.quantity }}</span>
</QTd>
</template> </template>
<template #column-price="{ row }"> <template #column-price="{ row }">
<QTd> <template v-if="isTicketEditable && row.id">
<template v-if="isTicketEditable && row.id"> <QBtn flat class="link" dense @click="onOpenEditPricePopover(row)">
<QBtn flat class="link" dense @click="onOpenEditPricePopover(row)"> {{ toCurrency(row.price) }}
{{ toCurrency(row.price) }} </QBtn>
</QBtn> <TicketEditManaProxy
<TicketEditManaProxy ref="editPriceProxyRef"
ref="editPriceProxyRef" :mana="mana"
:mana="mana" :new-price="getNewPrice"
:new-price="getNewPrice" @save="updatePrice(row)"
@save="updatePrice(row)" >
> <VnInput
<VnInput v-model.number="edit.price"
v-model.number="edit.price" :label="t('ticketSale.price')"
:label="t('ticketSale.price')" type="number"
type="number" />
/> </TicketEditManaProxy>
</TicketEditManaProxy> </template>
</template> <span v-else>{{ toCurrency(row.price) }}</span>
<span v-else>{{ toCurrency(row.price) }}</span>
</QTd>
</template> </template>
<template #column-discount="{ row }"> <template #column-discount="{ row }">
<QTd> <template v-if="!isLocked && row.id">
<template v-if="!isLocked && row.id"> <QBtn flat class="link" dense @click="onOpenEditDiscountPopover(row)">
<QBtn flat class="link" dense @click="onOpenEditDiscountPopover(row)"> {{ toPercentage(row.discount / 100) }}
{{ toPercentage(row.discount / 100) }} </QBtn>
</QBtn> <TicketEditManaProxy
<TicketEditManaProxy :mana="mana"
:mana="mana" :new-price="getNewPrice"
:new-price="getNewPrice" @save="changeDiscount(row)"
@save="changeDiscount(row)" >
> <VnInput
<VnInput v-model.number="edit.discount"
v-model.number="edit.discount" :label="t('ticketSale.discount')"
:label="t('ticketSale.discount')" type="number"
type="number" />
/> </TicketEditManaProxy>
</TicketEditManaProxy> </template>
</template> <span v-else>{{ toPercentage(row.discount / 100) }}</span>
<span v-else>{{ toPercentage(row.discount / 100) }}</span>
</QTd>
</template> </template>
<template #column-amount="{ row }"> <template #column-amount="{ row }">
{{ toCurrency(row.quantity * row.price) }} {{ toCurrency(row.quantity * row.price) }}

4
src/pages/Ticket/Card/TicketVolume.vue
View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { ref, computed, onUnmounted, watch, nextTick } from 'vue'; import { ref, computed, onMounted, onUnmounted, watch, nextTick } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
@ -93,6 +93,8 @@ const applyVolumes = async (salesData) => {
} }
}; };
onMounted(() => (stateStore.rightDrawer = false));
onUnmounted(() => (stateStore.rightDrawer = false)); onUnmounted(() => (stateStore.rightDrawer = false));
</script> </script>