perf: ItemProposal
This commit is contained in:
parent
8d9bfd8f1d
commit
4226c52fc5
|
|
@ -160,13 +160,10 @@ defineExpose({ fetch, addFilter });
|
|||
|
||||
<template>
|
||||
<div v-if="append" class="full-width">
|
||||
{{ !props.autoLoad && !store.data && !isLoading }}
|
||||
{{ props.skeleton && props.autoLoad && !store.data }}
|
||||
<div
|
||||
v-if="!props.autoLoad && !store.data && !isLoading"
|
||||
class="info-row q-pa-md text-center"
|
||||
>
|
||||
asd
|
||||
<h5>
|
||||
{{ t('No data to display') }}
|
||||
</h5>
|
||||
|
|
|
|||
|
|
@ -14,11 +14,17 @@ const $props = defineProps({
|
|||
required: true,
|
||||
default: () => {},
|
||||
},
|
||||
tickets: {
|
||||
type: Array,
|
||||
required: false,
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
const proposalSelected = ref([]);
|
||||
const quantity = ref(-1);
|
||||
const token = session.getTokenMultimedia();
|
||||
|
||||
const index = ref(0);
|
||||
const currentTicket = computed(() => $props.tickets[index.value]);
|
||||
const showProposalDialog = ref(false);
|
||||
const defaultColumnAttrs = {
|
||||
align: 'left',
|
||||
|
|
@ -32,8 +38,16 @@ const statusConditionalValue = (row) => {
|
|||
return status;
|
||||
};
|
||||
const conditionalValue = (tag) => (tag === 1 ? 'match' : 'not-match');
|
||||
const conditionalValuePrice = ({ price2, priceOld }) =>
|
||||
price2 > priceOld * 1.3 ? 'match' : 'not-match';
|
||||
const conditionalValuePrice = (price) =>
|
||||
price > currentTicket.value.price * 1.3 ? 'match' : 'not-match';
|
||||
const changeTicket = (type, _index = 0) => {
|
||||
const value = type ? 1 : -1;
|
||||
const nextIndex = index.value + value + _index;
|
||||
const ticket = $props.tickets[nextIndex];
|
||||
if (ticket.ticketFk === currentTicket.value.ticketFk)
|
||||
return changeTicket(true, nextIndex - 1);
|
||||
index.value = nextIndex;
|
||||
};
|
||||
const columns = computed(() => [
|
||||
{
|
||||
...defaultColumnAttrs,
|
||||
|
|
@ -111,7 +125,6 @@ const columns = computed(() => [
|
|||
label: t('proposal.price2'),
|
||||
name: 'price2',
|
||||
field: 'price2',
|
||||
classes: ({ match8 }) => conditionalValuePrice(match8),
|
||||
},
|
||||
{
|
||||
...defaultColumnAttrs,
|
||||
|
|
@ -120,20 +133,6 @@ const columns = computed(() => [
|
|||
field: 'located',
|
||||
},
|
||||
]);
|
||||
const columnPrices = computed(() => [
|
||||
{
|
||||
...defaultColumnAttrs,
|
||||
label: t('proposal.ticket'),
|
||||
name: 'ticketFk',
|
||||
field: 'counter',
|
||||
},
|
||||
{
|
||||
...defaultColumnAttrs,
|
||||
label: t('proposal.Diff'),
|
||||
name: 'Diff',
|
||||
field: 'counter',
|
||||
},
|
||||
]);
|
||||
async function confirm() {
|
||||
quantity.value = 0;
|
||||
// const response = { address: address.value };
|
||||
|
|
@ -170,13 +169,38 @@ async function confirm() {
|
|||
<QBtn icon="close" flat round dense v-close-popup />
|
||||
</QCardSection>
|
||||
<QCardSection class="row items-center justify-center column items-stretch">
|
||||
<span class="text-h6 text-grey">{{ t('proposal.title') }}</span>
|
||||
<span class="text-h6 text-grey">
|
||||
{{ currentTicket }}
|
||||
{{
|
||||
t('proposal.title', {
|
||||
ticketFk: currentTicket.ticketFk,
|
||||
saleFk: currentTicket.saleFk,
|
||||
})
|
||||
}}**
|
||||
</span>
|
||||
</QCardSection>
|
||||
<QCardSection class="row items-center justify-center column items-stretch">
|
||||
<VnRow style="display: flex">
|
||||
<!-- <VnRow style="display: flex"> -->
|
||||
<div class="calendars-header" v-if="$props.tickets.length > 0">
|
||||
<QBtn
|
||||
icon="arrow_left"
|
||||
flat
|
||||
class="full-height"
|
||||
@click="changeTicket(false)"
|
||||
:disable="index === 0"
|
||||
/>
|
||||
<!-- <span>{{ currentTicket.ticketFk }}</span> -->
|
||||
<QBtn
|
||||
icon="arrow_right"
|
||||
flat
|
||||
class="full-height"
|
||||
@click="changeTicket(true)"
|
||||
:disable="index === $props.tickets.length - 1"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<VnPaginate
|
||||
:append="false"
|
||||
style="width: 70vw !important"
|
||||
data-key="ItemsGetSimilar"
|
||||
url="Items/getSimilar"
|
||||
:filter="{
|
||||
|
|
@ -204,8 +228,8 @@ async function confirm() {
|
|||
:rows-per-page-options="[0]"
|
||||
hide-pagination
|
||||
>
|
||||
<template #top-row="{ cols }">
|
||||
<QTr>
|
||||
<template #top-row>
|
||||
<!-- <QTr>
|
||||
<QTd />
|
||||
<QTd
|
||||
v-for="(col, index) in cols"
|
||||
|
|
@ -221,7 +245,7 @@ async function confirm() {
|
|||
dense
|
||||
/>
|
||||
</QTd>
|
||||
</QTr>
|
||||
</QTr> -->
|
||||
</template>
|
||||
<template #body-cell-longName="{ row, value }">
|
||||
<QTd align="right" class="text-primary">
|
||||
|
|
@ -237,88 +261,22 @@ async function confirm() {
|
|||
></div>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
<VnPaginate
|
||||
class="q-ml-sm"
|
||||
:append="false"
|
||||
style="width: 20vw !important; margin-left: 40px !important"
|
||||
data-key="ItemsGetSimilar"
|
||||
url="Items/getSimilar"
|
||||
:filter="{
|
||||
where: {
|
||||
itemFk: $props.item.itemFk,
|
||||
warehouseFk: $props.item.warehouseFk,
|
||||
},
|
||||
}"
|
||||
auto-load
|
||||
>
|
||||
<template #body>
|
||||
<QTable
|
||||
:rows="[
|
||||
{
|
||||
name: 'Frozen Yogurt',
|
||||
calories: 159,
|
||||
fat: 6.0,
|
||||
carbs: 24,
|
||||
protein: 4.0,
|
||||
sodium: 87,
|
||||
calcium: '14%',
|
||||
iron: '1%',
|
||||
},
|
||||
]"
|
||||
:columns="columnPrices"
|
||||
row-key="id"
|
||||
selection="single"
|
||||
:pagination="{ rowsPerPage: 0 }"
|
||||
class="full-width q-mt-md"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
v-model:selected="proposalSelected"
|
||||
:dense="$q.screen.lt.md"
|
||||
flat
|
||||
:grid="$q.screen.lt.md"
|
||||
auto-load
|
||||
:rows-per-page-options="[0]"
|
||||
hide-pagination
|
||||
>
|
||||
<template #top-row="{ cols }">
|
||||
<QTr>
|
||||
<QTd />
|
||||
<template #body-cell-price2="{ row, value }">
|
||||
<QTd
|
||||
v-for="(col, index) in cols"
|
||||
:key="index"
|
||||
style="max-width: 100px"
|
||||
class="col"
|
||||
align="center"
|
||||
:class="[conditionalValuePrice(value)]"
|
||||
>
|
||||
<component
|
||||
:is="col.columnFilter.component"
|
||||
v-if="col.columnFilter"
|
||||
v-model="col.columnFilter.filterValue"
|
||||
v-bind="col.columnFilter.attrs"
|
||||
v-on="col.columnFilter.event(col)"
|
||||
dense
|
||||
/>
|
||||
</QTd>
|
||||
</QTr>
|
||||
</template>
|
||||
<template #body-cell-longName="{ row, value }">
|
||||
<QTd align="right" class="text-primary">
|
||||
<QBtn flat color="blue" dense>{{ value }}</QBtn>
|
||||
<ItemDescriptorProxy :id="row.id" />
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-status="{ value }">
|
||||
<QTd class="col" align="center">
|
||||
<div
|
||||
:style="{ 'background-color': value }"
|
||||
style="height: 10px"
|
||||
></div>
|
||||
<QTooltip>
|
||||
{{ row.price2 }}/{{ currentTicket.price }}
|
||||
</QTooltip>
|
||||
{{ value }}
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</VnRow>
|
||||
</div>
|
||||
</QCardSection>
|
||||
<QCardActions align="right">
|
||||
<QBtn :label="t('globals.cancel')" color="primary" flat v-close-popup />
|
||||
|
|
@ -350,9 +308,13 @@ async function confirm() {
|
|||
.not-match {
|
||||
color: inherit;
|
||||
}
|
||||
.calendars-header {
|
||||
height: 45px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: $primary;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
xx: xx
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ itemType:
|
|||
category: Reino
|
||||
temperature: Temperatura
|
||||
proposal:
|
||||
title: Items de sustitución
|
||||
title: Items de sustitución para el ticket {ticketFk}:{saleFk}
|
||||
itemFk: Item
|
||||
longName: Nombre
|
||||
subName: Productor
|
||||
|
|
|
|||
|
|
@ -343,18 +343,6 @@ const split = async () => {
|
|||
>
|
||||
</Teleport>
|
||||
<Teleport to="#st-data" v-if="stateStore?.isSubToolbarShown()">
|
||||
<QImg
|
||||
:src="`/api/Images/catalog/50x50/${item.itemFk}/download?access_token=${token}`"
|
||||
spinner-color="primary"
|
||||
:ratio="1"
|
||||
height="50px"
|
||||
width="50px"
|
||||
class="image remove-bg"
|
||||
:alt="'asdads'"
|
||||
/>
|
||||
|
||||
<span class="text-h6">{{ item.longName }}</span>
|
||||
<span>{{ item }}</span>
|
||||
<QSpace />
|
||||
<QBtnGroup push style="column-gap: 1px">
|
||||
<QBtn
|
||||
|
|
@ -416,6 +404,18 @@ const split = async () => {
|
|||
>
|
||||
<!-- :rows="rows" -->
|
||||
<template #body="{ rows }">
|
||||
<QImg
|
||||
:src="`/api/Images/catalog/50x50/${item.itemFk}/download?access_token=${token}`"
|
||||
spinner-color="primary"
|
||||
:ratio="1"
|
||||
height="50px"
|
||||
width="50px"
|
||||
class="image remove-bg"
|
||||
:alt="'asdads'"
|
||||
/>
|
||||
|
||||
<span class="text-h6">{{ item.longName }}</span>
|
||||
|
||||
<QTable
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
|
|
@ -533,5 +533,6 @@ const split = async () => {
|
|||
@hide="onDialogHide"
|
||||
v-model="showProposalDialog"
|
||||
:item="item"
|
||||
:tickets="selectedRows"
|
||||
></ItemProposal>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue