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

corrections

This commit is contained in:
Alexandre Riera 2022-11-30 14:35:05 +01:00
parent 7ee8dbf2d6
commit e35c11d714
4 changed files with 226 additions and 237 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/filters/index.js
View File

@ -3,7 +3,6 @@ import toDate from './toDate';
import toCurrency from './toCurrency'; import toCurrency from './toCurrency';
import toPercentage from './toPercentage'; import toPercentage from './toPercentage';
import dashIfEmpty from './dashIfEmpty'; import dashIfEmpty from './dashIfEmpty';
import zeroFill from './zeroFill';
export { export {
toLowerCase, toLowerCase,
@ -11,5 +10,4 @@ export {
toCurrency, toCurrency,
toPercentage, toPercentage,
dashIfEmpty, dashIfEmpty,
zeroFill
}; };

4
src/filters/zeroFill.js
View File

@ -1,4 +0,0 @@
export default function (value, pad) {
const valueStr = String(value);
return valueStr.padStart(pad, '0');
}

424
src/pages/Ticket/Card/TicketSummary.vue
View File

@ -3,7 +3,7 @@ import { onMounted, ref, computed, onUpdated } from 'vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import axios from 'axios'; import axios from 'axios';
import { dashIfEmpty, toDate, toCurrency, zeroFill } from 'src/filters'; import { dashIfEmpty, toDate, toCurrency } from 'src/filters';
import SkeletonSummary from 'components/ui/SkeletonSummary.vue'; import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import FetchedTags from 'components/ui/FetchedTags.vue'; import FetchedTags from 'components/ui/FetchedTags.vue';
@ -33,7 +33,6 @@ async function fetch() {
const { data } = await axios.get(`Tickets/${entityId.value}/summary`); const { data } = await axios.get(`Tickets/${entityId.value}/summary`);
if (data) { if (data) {
ticket.value = data; ticket.value = data;
console.log(ticket.value);
salesLines.value = data.sales; salesLines.value = data.sales;
} }
} }
@ -92,7 +91,8 @@ async function changeState(value) {
<q-btn-dropdown <q-btn-dropdown
side side
top top
color="dark" color="orange-11"
text-color="black"
:label="t('ticket.summary.changeState')" :label="t('ticket.summary.changeState')"
:disable="!isEditable()" :disable="!isEditable()"
> >
@ -248,199 +248,221 @@ async function changeState(value) {
</div> </div>
<div class="row q-pa-md" v-if="salesLines.length > 0"> <div class="row q-pa-md" v-if="salesLines.length > 0">
<div class="col"> <div class="col">
<q-item-label header class="text-h6"> <q-list>
{{ t('ticket.summary.saleLines') }} <q-item-label header class="text-h6">
<q-tooltip>{{ t('ticket.summary.goTo') }}</q-tooltip> {{ t('ticket.summary.saleLines') }}
</q-item-label> <router-link
<q-table :rows="ticket.sales"> :to="{ name: 'TicketBasicData', params: { id: entityId } }"
<template #header="props"> target="_blank"
<q-tr :props="props"> >
<q-th auto-width></q-th> <q-icon name="open_in_new" />
<q-th auto-width>{{ t('ticket.summary.item') }}</q-th> </router-link>
<q-th auto-width>{{ t('ticket.summary.visible') }}</q-th> </q-item-label>
<q-th auto-width>{{ t('ticket.summary.available') }}</q-th> <q-table :rows="ticket.sales" flat>
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th> <template #header="props">
<q-th auto-width>{{ t('ticket.summary.description') }}</q-th> <q-tr :props="props">
<q-th auto-width>{{ t('ticket.summary.price') }}</q-th> <q-th auto-width></q-th>
<q-th auto-width>{{ t('ticket.summary.discount') }}</q-th> <q-th auto-width>{{ t('ticket.summary.item') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.amount') }}</q-th> <q-th auto-width>{{ t('ticket.summary.visible') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.packing') }}</q-th> <q-th auto-width>{{ t('ticket.summary.available') }}</q-th>
</q-tr> <q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
</template> <q-th auto-width>{{ t('ticket.summary.description') }}</q-th>
<template #body="props"> <q-th auto-width>{{ t('ticket.summary.price') }}</q-th>
<q-tr :props="props"> <q-th auto-width>{{ t('ticket.summary.discount') }}</q-th>
<q-td> <q-th auto-width>{{ t('ticket.summary.amount') }}</q-th>
<q-btn <q-th auto-width>{{ t('ticket.summary.packing') }}</q-th>
flat </q-tr>
round </template>
size="xs" <template #body="props">
icon="vn:claims" <q-tr :props="props">
v-if="props.row.claim" <q-td>
color="primary" <q-btn
:to="{ name: 'ClaimCard', params: { id: props.row.claim.claimFk } }" flat
> round
<q-tooltip size="xs"
>{{ t('ticket.summary.claim') }}: icon="vn:claims"
{{ props.row.claim.claimFk }}</q-tooltip v-if="props.row.claim"
color="primary"
:to="{ name: 'ClaimCard', params: { id: props.row.claim.claimFk } }"
> >
</q-btn> <q-tooltip
<q-btn >{{ t('ticket.summary.claim') }}:
flat {{ props.row.claim.claimFk }}</q-tooltip
round >
size="xs" </q-btn>
icon="vn:claims" <q-btn
v-if="props.row.claimBeginning" flat
color="primary" round
:to="{ size="xs"
name: 'ClaimCard', icon="vn:claims"
params: { id: props.row.claimBeginning.claimFk }, v-if="props.row.claimBeginning"
}" color="primary"
> :to="{
<q-tooltip name: 'ClaimCard',
>{{ t('ticket.summary.claim') }}: params: { id: props.row.claimBeginning.claimFk },
{{ props.row.claimBeginning.claimFk }}</q-tooltip }"
> >
</q-btn> <q-tooltip
<q-icon name="warning" v-show="props.row.visible < 0" size="xs" color="primary"> >{{ t('ticket.summary.claim') }}:
<q-tooltip {{ props.row.claimBeginning.claimFk }}</q-tooltip
>{{ t('ticket.summary.visible') }}: {{ props.row.visible }}</q-tooltip >
</q-btn>
<q-icon
name="warning"
v-show="props.row.visible < 0"
size="xs"
color="primary"
> >
</q-icon> <q-tooltip
<q-icon name="vn:reserva" v-show="props.row.reserved" size="xs" color="primary"> >{{ t('ticket.summary.visible') }}:
<q-tooltip>{{ t('ticket.summary.reserved') }}</q-tooltip> {{ props.row.visible }}</q-tooltip
</q-icon> >
<q-icon </q-icon>
name="vn:unavailable" <q-icon
v-show="props.row.itemShortage" name="vn:reserva"
size="xs" v-show="props.row.reserved"
color="primary" size="xs"
> color="primary"
<q-tooltip>{{ t('ticket.summary.itemShortage') }}</q-tooltip> >
</q-icon> <q-tooltip>{{ t('ticket.summary.reserved') }}</q-tooltip>
<q-icon </q-icon>
name="vn:components" <q-icon
v-show="props.row.hasComponentLack" name="vn:unavailable"
size="xs" v-show="props.row.itemShortage"
color="primary" size="xs"
> color="primary"
<q-tooltip>{{ t('ticket.summary.hasComponentLack') }}</q-tooltip> >
</q-icon> <q-tooltip>{{ t('ticket.summary.itemShortage') }}</q-tooltip>
</q-td> </q-icon>
<q-td class="link">{{ zeroFill(props.row.itemFk, 6) }}</q-td> <q-icon
<q-td>{{ props.row.visible }}</q-td> name="vn:components"
<q-td>{{ props.row.available }}</q-td> v-show="props.row.hasComponentLack"
<q-td>{{ props.row.quantity }}</q-td> size="xs"
<q-td> color="primary"
<div class="fetched-tags"> >
<span>{{ props.row.item.name }}</span> <q-tooltip>{{ t('ticket.summary.hasComponentLack') }}</q-tooltip>
<span v-if="props.row.item.subName" class="subName">{{ </q-icon>
props.row.item.subName </q-td>
}}</span> <q-td class="link">{{ props.row.itemFk }}</q-td>
</div> <q-td>{{ props.row.visible }}</q-td>
<fetched-tags :item="props.row.item" :max-length="5"></fetched-tags> <q-td>{{ props.row.available }}</q-td>
</q-td> <q-td>{{ props.row.quantity }}</q-td>
<q-td>{{ props.row.price }}</q-td> <q-td>
<q-td>{{ props.row.discount }} %</q-td> <div class="fetched-tags">
<q-td <span>{{ props.row.item.name }}</span>
>{{ <span v-if="props.row.item.subName" class="subName">{{
toCurrency( props.row.item.subName
props.row.quantity * }}</span>
props.row.price * </div>
((100 - props.row.discount) / 100) <fetched-tags :item="props.row.item" :max-length="5"></fetched-tags>
) </q-td>
}} <q-td>{{ props.row.price }}</q-td>
</q-td> <q-td>{{ props.row.discount }} %</q-td>
<q-td>{{ dashIfEmpty(props.row.item.itemPackingTypeFk) }}</q-td> <q-td
</q-tr> >{{
</template> toCurrency(
</q-table> props.row.quantity *
props.row.price *
((100 - props.row.discount) / 100)
)
}}
</q-td>
<q-td>{{ dashIfEmpty(props.row.item.itemPackingTypeFk) }}</q-td>
</q-tr>
</template>
</q-table>
</q-list>
</div> </div>
</div> </div>
<div class="row q-pa-md" v-if="ticket.packagings.length > 0 || ticket.services.length > 0"> <div class="row q-pa-md" v-if="ticket.packagings.length > 0 || ticket.services.length > 0">
<div class="col" v-if="ticket.packagings.length > 0"> <div class="col" v-if="ticket.packagings.length > 0">
<q-item-label header class="text-h6"> <q-list>
{{ t('ticket.summary.packages') }} <q-item-label header class="text-h6">
<q-tooltip>{{ t('ticket.summary.goTo') }}</q-tooltip> {{ t('ticket.summary.packages') }}
</q-item-label> <q-icon name="open_in_new" />
<q-table :rows="ticket.packagings"> </q-item-label>
<template #header="props"> <q-table :rows="ticket.packagings" flat>
<q-tr :props="props"> <template #header="props">
<q-th auto-width>{{ t('ticket.summary.created') }}</q-th> <q-tr :props="props">
<q-th auto-width>{{ t('ticket.summary.package') }}</q-th> <q-th auto-width>{{ t('ticket.summary.created') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th> <q-th auto-width>{{ t('ticket.summary.package') }}</q-th>
</q-tr> <q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
</template> </q-tr>
<template #body="props"> </template>
<q-tr :props="props"> <template #body="props">
<q-td>{{ toDate(props.row.created) }}</q-td> <q-tr :props="props">
<q-td>{{ props.row.packaging.item.name }}</q-td> <q-td>{{ toDate(props.row.created) }}</q-td>
<q-td>{{ props.row.quantity }}</q-td> <q-td>{{ props.row.packaging.item.name }}</q-td>
</q-tr> <q-td>{{ props.row.quantity }}</q-td>
</template> </q-tr>
</q-table> </template>
</q-table>
</q-list>
</div> </div>
<div class="col" v-if="ticket.services.length > 0"> <div class="col" v-if="ticket.services.length > 0">
<q-item-label header class="text-h6"> <q-list>
{{ t('ticket.summary.services') }} <q-item-label header class="text-h6">
<q-tooltip>{{ t('ticket.summary.goTo') }}</q-tooltip> {{ t('ticket.summary.services') }}
</q-item-label> <q-icon name="open_in_new" />
<q-table :rows="ticket.services"> </q-item-label>
<template #header="props"> <q-table :rows="ticket.services" flat>
<q-tr :props="props"> <template #header="props">
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th> <q-tr :props="props">
<q-th auto-width>{{ t('ticket.summary.description') }}</q-th> <q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.price') }}</q-th> <q-th auto-width>{{ t('ticket.summary.description') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.taxClass') }}</q-th> <q-th auto-width>{{ t('ticket.summary.price') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.amount') }}</q-th> <q-th auto-width>{{ t('ticket.summary.taxClass') }}</q-th>
</q-tr> <q-th auto-width>{{ t('ticket.summary.amount') }}</q-th>
</template> </q-tr>
<template #body="props"> </template>
<q-tr :props="props"> <template #body="props">
<q-td>{{ props.row.quantity }}</q-td> <q-tr :props="props">
<q-td>{{ props.row.description }}</q-td> <q-td>{{ props.row.quantity }}</q-td>
<q-td>{{ toCurrency(props.row.price) }}</q-td> <q-td>{{ props.row.description }}</q-td>
<q-td>{{ props.row.taxClass.description }}</q-td> <q-td>{{ toCurrency(props.row.price) }}</q-td>
<q-td>{{ toCurrency(props.row.quantity * props.row.price) }}</q-td> <q-td>{{ props.row.taxClass.description }}</q-td>
</q-tr> <q-td>{{ toCurrency(props.row.quantity * props.row.price) }}</q-td>
</template> </q-tr>
</q-table> </template>
</q-table>
</q-list>
</div> </div>
</div> </div>
<div class="row q-pa-md" v-if="ticket.requests.length > 0"> <div class="row q-pa-md" v-if="ticket.requests.length > 0">
<div class="col"> <div class="col">
<q-item-label header class="text-h6"> <q-list>
{{ t('ticket.summary.request') }} <q-item-label header class="text-h6">
<q-tooltip>{{ t('ticket.summary.goTo') }}</q-tooltip> {{ t('ticket.summary.request') }}
</q-item-label> <q-icon name="open_in_new" />
<q-table :rows="ticket.requests"> </q-item-label>
<template #header="props"> <q-table :rows="ticket.requests" flat>
<q-tr :props="props"> <template #header="props">
<q-th auto-width>{{ t('ticket.summary.description') }}</q-th> <q-tr :props="props">
<q-th auto-width>{{ t('ticket.summary.created') }}</q-th> <q-th auto-width>{{ t('ticket.summary.description') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.requester') }}</q-th> <q-th auto-width>{{ t('ticket.summary.created') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.atender') }}</q-th> <q-th auto-width>{{ t('ticket.summary.requester') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th> <q-th auto-width>{{ t('ticket.summary.atender') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.price') }}</q-th> <q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
<q-th auto-width>{{ t('ticket.summary.item') }}</q-th> <q-th auto-width>{{ t('ticket.summary.price') }}</q-th>
<q-th auto-width>Ok</q-th> <q-th auto-width>{{ t('ticket.summary.item') }}</q-th>
</q-tr> <q-th auto-width>Ok</q-th>
</template> </q-tr>
<template #body="props"> </template>
<q-tr :props="props"> <template #body="props">
<q-td>{{ props.row.description }}</q-td> <q-tr :props="props">
<q-td>{{ toDate(props.row.created) }}</q-td> <q-td>{{ props.row.description }}</q-td>
<q-td>{{ props.row.requester.user.name }}</q-td> <q-td>{{ toDate(props.row.created) }}</q-td>
<q-td>{{ props.row.atender.user.name }}</q-td> <q-td>{{ props.row.requester.user.name }}</q-td>
<q-td>{{ props.row.quantity }}</q-td> <q-td>{{ props.row.atender.user.name }}</q-td>
<q-td>{{ toCurrency(props.row.price) }}</q-td> <q-td>{{ props.row.quantity }}</q-td>
<q-td v-if="!props.row.sale">-</q-td> <q-td>{{ toCurrency(props.row.price) }}</q-td>
<q-td v-if="props.row.sale" class="link">{{ <q-td v-if="!props.row.sale">-</q-td>
zeroFill(props.row.sale.itemFk, 6) <q-td v-if="props.row.sale" class="link">{{ props.row.sale.itemFk }}</q-td>
}}</q-td> <q-td><q-checkbox v-model="props.row.isOk" :disable="true" /></q-td>
<q-td><q-checkbox v-model="props.row.isOk" :disable="true" /></q-td> </q-tr>
</q-tr> </template>
</template> </q-table>
</q-table> </q-list>
</div> </div>
</div> </div>
</template> </template>
@ -455,9 +477,21 @@ async function changeState(value) {
.q-card { .q-card {
width: 100%; width: 100%;
height: 100%;
max-width: 1200px;
} }
.summary { .summary {
.q-list {
.q-item__label--header {
display: flex;
justify-content: space-between;
a {
color: $primary;
}
}
}
.fetched-tags { .fetched-tags {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -494,26 +528,6 @@ async function changeState(value) {
} }
} }
.text-h6 {
margin-bottom: $spacing-md;
text-transform: uppercase;
line-height: 1;
padding: 7px 0;
padding-bottom: 5px;
border-bottom: 2px solid $primary;
overflow: hidden;
position: relative;
}
.text-h6:after {
font-family: 'Material Icons';
content: 'open_in_new';
position: absolute;
right: 5px;
text-transform: none;
color: $primary;
}
.header { .header {
font-size: 18px; font-size: 18px;
display: flex; display: flex;
@ -532,4 +546,8 @@ async function changeState(value) {
} }
} }
} }
.q-dialog .summary {
max-width: 1200px;
}
</style> </style>

33
src/pages/Ticket/TicketList.vue
View File

@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import Paginate from 'components/Paginate.vue'; import Paginate from 'components/Paginate.vue';
import { toDate, toCurrency } from 'src/filters/index'; import { toDate, toCurrency } from 'src/filters/index';
// import TicketSummary from './Card/TicketSummary.vue'; import TicketSummary from './Card/TicketSummary.vue';
const router = useRouter(); const router = useRouter();
const { t } = useI18n(); const { t } = useI18n();
@ -55,7 +55,7 @@ const preview = ref({
function showPreview(id) { function showPreview(id) {
preview.value.shown = true; preview.value.shown = true;
preview.value.data = { preview.value.data = {
customerId: id, ticketId: id,
}; };
} }
</script> </script>
@ -108,42 +108,19 @@ function showPreview(id) {
</q-item-section> </q-item-section>
<q-separator vertical /> <q-separator vertical />
<q-card-actions vertical class="justify-between"> <q-card-actions vertical class="justify-between">
<!-- <q-btn color="grey-7" round flat icon="more_vert">
<q-tooltip>{{ t('customer.list.moreOptions') }}</q-tooltip>
<q-menu cover auto-close>
<q-list>
<q-item clickable>
<q-item-section avatar>
<q-icon name="add" />
</q-item-section>
<q-item-section>Add a note</q-item-section>
</q-item>
<q-item clickable>
<q-item-section avatar>
<q-icon name="history" />
</q-item-section>
<q-item-section>Display customer history</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn> -->
<q-btn flat round color="orange" icon="arrow_circle_right" @click="navigate(row.id)"> <q-btn flat round color="orange" icon="arrow_circle_right" @click="navigate(row.id)">
<q-tooltip>{{ t('components.smartCard.openCard') }}</q-tooltip> <q-tooltip>{{ t('components.smartCard.openCard') }}</q-tooltip>
</q-btn> </q-btn>
<q-btn flat round color="grey-7" icon="preview" @click="showPreview(row.id)"> <q-btn flat round color="grey-7" icon="preview" @click="showPreview(row.id)">
<q-tooltip>{{ t('components.smartCard.openSummary') }}</q-tooltip> <q-tooltip>{{ t('components.smartCard.openSummary') }}</q-tooltip>
</q-btn> </q-btn>
<!-- <q-btn flat round color="grey-7" icon="vn:ticket">
<q-tooltip>{{ t('customer.list.customerOrders') }}</q-tooltip>
</q-btn> -->
</q-card-actions> </q-card-actions>
</q-item> </q-item>
</q-card> </q-card>
</template> </template>
</paginate> </paginate>
</q-page> </q-page>
<!-- <q-dialog v-model="preview.shown"> <q-dialog v-model="preview.shown">
<customer-summary :customer-id="preview.data.customerId" /> <ticket-summary :id="preview.data.ticketId" />
</q-dialog> --> </q-dialog>
</template> </template>