forked from verdnatura/salix-front
refs #6336 feat(claim): improvements
This commit is contained in:
parent
32382622e4
commit
4efe09722f
|
@ -24,6 +24,10 @@ const $props = defineProps({
|
||||||
type: String,
|
type: String,
|
||||||
default: '',
|
default: '',
|
||||||
},
|
},
|
||||||
|
limit: {
|
||||||
|
type: Number,
|
||||||
|
default: 20,
|
||||||
|
},
|
||||||
saveUrl: {
|
saveUrl: {
|
||||||
type: String,
|
type: String,
|
||||||
default: null,
|
default: null,
|
||||||
|
@ -76,6 +80,7 @@ defineExpose({
|
||||||
reset,
|
reset,
|
||||||
hasChanges,
|
hasChanges,
|
||||||
saveChanges,
|
saveChanges,
|
||||||
|
getChanges,
|
||||||
});
|
});
|
||||||
|
|
||||||
async function fetch(data) {
|
async function fetch(data) {
|
||||||
|
@ -260,6 +265,7 @@ watch(formUrl, async () => {
|
||||||
<template>
|
<template>
|
||||||
<VnPaginate
|
<VnPaginate
|
||||||
:url="url"
|
:url="url"
|
||||||
|
:limit="limit"
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
@on-fetch="fetch"
|
@on-fetch="fetch"
|
||||||
:skeleton="false"
|
:skeleton="false"
|
||||||
|
|
|
@ -75,7 +75,7 @@ async function insert() {
|
||||||
<QPageSticky position="bottom-right" :offset="[25, 25]" v-if="addNote">
|
<QPageSticky position="bottom-right" :offset="[25, 25]" v-if="addNote">
|
||||||
<QBtn color="primary" icon="add" size="lg" round @click="noteModal = true" />
|
<QBtn color="primary" icon="add" size="lg" round @click="noteModal = true" />
|
||||||
</QPageSticky>
|
</QPageSticky>
|
||||||
<QDialog v-model="noteModal" @hide="newNote = ''">
|
<QDialog v-model="noteModal" @hide="newNote = ''" persistent>
|
||||||
<QCard>
|
<QCard>
|
||||||
<QCardSection>
|
<QCardSection>
|
||||||
<QItem class="q-px-none">
|
<QItem class="q-px-none">
|
||||||
|
|
|
@ -96,8 +96,7 @@ export function useArrayData(key, userOptions) {
|
||||||
});
|
});
|
||||||
|
|
||||||
const { limit } = filter;
|
const { limit } = filter;
|
||||||
|
hasMoreData.value = limit && response.data.length >= limit;
|
||||||
hasMoreData.value = response.data.length >= limit;
|
|
||||||
|
|
||||||
if (append) {
|
if (append) {
|
||||||
if (!store.data) store.data = [];
|
if (!store.data) store.data = [];
|
||||||
|
|
|
@ -121,11 +121,6 @@ async function fetchMana() {
|
||||||
mana.value = response.data;
|
mana.value = response.data;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function updateQuantity({ id, quantity }) {
|
|
||||||
if (!id) return;
|
|
||||||
await axios.patch(`ClaimBeginnings/${id}`, { quantity });
|
|
||||||
}
|
|
||||||
|
|
||||||
async function updateDiscount({ saleFk, discount, canceller }) {
|
async function updateDiscount({ saleFk, discount, canceller }) {
|
||||||
const body = { salesIds: [saleFk], newDiscount: discount };
|
const body = { salesIds: [saleFk], newDiscount: discount };
|
||||||
const claimId = claim.value.ticketFk;
|
const claimId = claim.value.ticketFk;
|
||||||
|
@ -155,6 +150,10 @@ function showImportDialog() {
|
||||||
})
|
})
|
||||||
.onOk(() => claimLinesForm.value.reload());
|
.onOk(() => claimLinesForm.value.reload());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function saveWhenHasChanges() {
|
||||||
|
claimLinesForm.value.getChanges().updates && claimLinesForm.value.onSubmit();
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
|
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
|
||||||
|
@ -181,8 +180,7 @@ function showImportDialog() {
|
||||||
@on-fetch="onFetchClaim"
|
@on-fetch="onFetchClaim"
|
||||||
auto-load
|
auto-load
|
||||||
/>
|
/>
|
||||||
<div class="column items-center">
|
<div class="q-pa-md">
|
||||||
<div class="list">
|
|
||||||
<CrudModel
|
<CrudModel
|
||||||
data-key="ClaimLines"
|
data-key="ClaimLines"
|
||||||
ref="claimLinesForm"
|
ref="claimLinesForm"
|
||||||
|
@ -195,6 +193,7 @@ function showImportDialog() {
|
||||||
:default-save="false"
|
:default-save="false"
|
||||||
:default-reset="false"
|
:default-reset="false"
|
||||||
auto-load
|
auto-load
|
||||||
|
:limit="0"
|
||||||
>
|
>
|
||||||
<template #body="{ rows }">
|
<template #body="{ rows }">
|
||||||
<QTable
|
<QTable
|
||||||
|
@ -206,26 +205,15 @@ function showImportDialog() {
|
||||||
v-model:selected="selected"
|
v-model:selected="selected"
|
||||||
:grid="$q.screen.lt.md"
|
:grid="$q.screen.lt.md"
|
||||||
>
|
>
|
||||||
<template #body-cell-claimed="{ row, value }">
|
<template #body-cell-claimed="{ row }">
|
||||||
<QTd auto-width align="right" class="text-primary">
|
<QTd auto-width align="right" class="text-primary">
|
||||||
<span>{{ value }}</span>
|
|
||||||
|
|
||||||
<QPopupEdit
|
|
||||||
v-model="row.quantity"
|
|
||||||
v-slot="scope"
|
|
||||||
:title="t('Claimed quantity')"
|
|
||||||
@update:model-value="updateQuantity(row)"
|
|
||||||
buttons
|
|
||||||
>
|
|
||||||
<QInput
|
<QInput
|
||||||
v-model="scope.value"
|
v-model="row.quantity"
|
||||||
type="number"
|
type="number"
|
||||||
dense
|
dense
|
||||||
autofocus
|
@keyup.enter="saveWhenHasChanges()"
|
||||||
@keyup.enter="scope.set"
|
@blur="saveWhenHasChanges()"
|
||||||
@focus="($event) => $event.target.select()"
|
|
||||||
/>
|
/>
|
||||||
</QPopupEdit>
|
|
||||||
</QTd>
|
</QTd>
|
||||||
</template>
|
</template>
|
||||||
<template #body-cell-description="{ row, value }">
|
<template #body-cell-description="{ row, value }">
|
||||||
|
@ -272,32 +260,18 @@ function showImportDialog() {
|
||||||
</QItemLabel>
|
</QItemLabel>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
<QItemSection side>
|
<QItemSection side>
|
||||||
<template
|
<template v-if="column.name === 'claimed'">
|
||||||
v-if="column.name === 'claimed'"
|
|
||||||
>
|
|
||||||
<QItemLabel class="text-primary">
|
<QItemLabel class="text-primary">
|
||||||
{{ column.value }}
|
|
||||||
<QPopupEdit
|
|
||||||
v-model="props.row.quantity"
|
|
||||||
v-slot="scope"
|
|
||||||
:title="t('Claimed quantity')"
|
|
||||||
@update:model-value="
|
|
||||||
updateQuantity(props.row)
|
|
||||||
"
|
|
||||||
buttons
|
|
||||||
>
|
|
||||||
<QInput
|
<QInput
|
||||||
v-model="scope.value"
|
v-model="props.row.quantity"
|
||||||
type="number"
|
type="number"
|
||||||
dense
|
dense
|
||||||
autofocus
|
autofocus
|
||||||
@keyup.enter="scope.set"
|
@keyup.enter="
|
||||||
@focus="
|
saveWhenHasChanges()
|
||||||
($event) =>
|
|
||||||
$event.target.select()
|
|
||||||
"
|
"
|
||||||
|
@blur="saveWhenHasChanges()"
|
||||||
/>
|
/>
|
||||||
</QPopupEdit>
|
|
||||||
</QItemLabel>
|
</QItemLabel>
|
||||||
</template>
|
</template>
|
||||||
<template
|
<template
|
||||||
|
@ -336,7 +310,6 @@ function showImportDialog() {
|
||||||
</template>
|
</template>
|
||||||
</CrudModel>
|
</CrudModel>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<QPageSticky position="bottom-right" :offset="[25, 25]">
|
<QPageSticky position="bottom-right" :offset="[25, 25]">
|
||||||
<QBtn fab color="primary" icon="add" @click="showImportDialog()" />
|
<QBtn fab color="primary" icon="add" @click="showImportDialog()" />
|
||||||
|
|
|
@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'components/FetchData.vue';
|
||||||
import { toDate, toCurrency, toPercentage } from 'filters/index';
|
import { toDate, toCurrency, toPercentage } from 'filters/index';
|
||||||
|
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
defineEmits([...useDialogPluginComponent.emits]);
|
defineEmits([...useDialogPluginComponent.emits]);
|
||||||
|
@ -118,7 +119,6 @@ function cancel() {
|
||||||
<QBtn icon="close" flat round dense v-close-popup />
|
<QBtn icon="close" flat round dense v-close-popup />
|
||||||
</QCardSection>
|
</QCardSection>
|
||||||
<QTable
|
<QTable
|
||||||
class="my-sticky-header-table"
|
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:rows="claimableSales"
|
:rows="claimableSales"
|
||||||
row-key="saleFk"
|
row-key="saleFk"
|
||||||
|
@ -126,7 +126,14 @@ function cancel() {
|
||||||
v-model:selected="selected"
|
v-model:selected="selected"
|
||||||
square
|
square
|
||||||
flat
|
flat
|
||||||
/>
|
>
|
||||||
|
<template #body-cell-description="{ row, value }">
|
||||||
|
<QTd auto-width align="right" class="link">
|
||||||
|
{{ value }}
|
||||||
|
<ItemDescriptorProxy :id="row.itemFk"></ItemDescriptorProxy>
|
||||||
|
</QTd>
|
||||||
|
</template>
|
||||||
|
</QTable>
|
||||||
<QSeparator />
|
<QSeparator />
|
||||||
<QCardActions align="right">
|
<QCardActions align="right">
|
||||||
<QBtn :label="t('globals.cancel')" color="primary" flat @click="cancel" />
|
<QBtn :label="t('globals.cancel')" color="primary" flat @click="cancel" />
|
||||||
|
@ -148,33 +155,6 @@ function cancel() {
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.my-sticky-header-table {
|
|
||||||
height: 400px;
|
|
||||||
|
|
||||||
thead tr th {
|
|
||||||
position: sticky;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
thead tr:first-child th {
|
|
||||||
/* this is when the loading indicator appears */
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.q-table--loading thead tr:last-child th {
|
|
||||||
/* height of all previous header rows */
|
|
||||||
top: 48px;
|
|
||||||
}
|
|
||||||
|
|
||||||
// /* prevent scrolling behind sticky top row on focus */
|
|
||||||
tbody {
|
|
||||||
/* height of all previous header rows */
|
|
||||||
scroll-margin-top: 48px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<i18n>
|
<i18n>
|
||||||
es:
|
es:
|
||||||
Available sales lines: Líneas de venta disponibles
|
Available sales lines: Líneas de venta disponibles
|
||||||
|
|
|
@ -222,23 +222,11 @@ function openDialog(dmsId) {
|
||||||
</template>
|
</template>
|
||||||
</VnLv>
|
</VnLv>
|
||||||
<VnLv
|
<VnLv
|
||||||
:label="t('claim.summary.pickup')"
|
:label="t('claim.basicData.pickup')"
|
||||||
:value="t(`claim.summary.${claim.pickup}`)"
|
:value="t(`claim.basicData.${claim.pickup}`)"
|
||||||
/>
|
/>
|
||||||
</QCard>
|
</QCard>
|
||||||
<QCard class="vn-three">
|
<QCard class="vn-three" v-if="salesClaimed.length > 0">
|
||||||
<VnTitle
|
|
||||||
:url="`#/claim/${entityId}/notes`"
|
|
||||||
:text="t('claim.summary.notes')"
|
|
||||||
/>
|
|
||||||
<ClaimNotes
|
|
||||||
:id="entityId"
|
|
||||||
:add-note="false"
|
|
||||||
style="max-height: 300px"
|
|
||||||
order="created ASC"
|
|
||||||
/>
|
|
||||||
</QCard>
|
|
||||||
<QCard class="vn-two" v-if="salesClaimed.length > 0">
|
|
||||||
<VnTitle
|
<VnTitle
|
||||||
:url="`#/claim/${entityId}/lines`"
|
:url="`#/claim/${entityId}/lines`"
|
||||||
:text="t('claim.summary.details')"
|
:text="t('claim.summary.details')"
|
||||||
|
@ -280,6 +268,60 @@ function openDialog(dmsId) {
|
||||||
</template>
|
</template>
|
||||||
</QTable>
|
</QTable>
|
||||||
</QCard>
|
</QCard>
|
||||||
|
<QCard class="vn-two">
|
||||||
|
<VnTitle
|
||||||
|
:url="`#/claim/${entityId}/notes`"
|
||||||
|
:text="t('claim.summary.notes')"
|
||||||
|
/>
|
||||||
|
<ClaimNotes
|
||||||
|
:id="entityId"
|
||||||
|
:add-note="false"
|
||||||
|
style="max-height: 300px"
|
||||||
|
order="created ASC"
|
||||||
|
/>
|
||||||
|
</QCard>
|
||||||
|
<QCard class="vn-two" v-if="claimDms.length > 0">
|
||||||
|
<VnTitle
|
||||||
|
:url="`#/claim/${entityId}/photos`"
|
||||||
|
:text="t('claim.summary.photos')"
|
||||||
|
/>
|
||||||
|
<div class="container">
|
||||||
|
<div
|
||||||
|
class="multimedia-container"
|
||||||
|
v-for="(media, index) of claimDms"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="relative-position">
|
||||||
|
<QIcon
|
||||||
|
name="play_circle"
|
||||||
|
color="primary"
|
||||||
|
size="xl"
|
||||||
|
class="absolute-center zindex"
|
||||||
|
v-if="media.isVideo"
|
||||||
|
@click.stop="openDialog(media.dmsFk)"
|
||||||
|
>
|
||||||
|
<QTooltip>Video</QTooltip>
|
||||||
|
</QIcon>
|
||||||
|
<QCard class="multimedia relative-position">
|
||||||
|
<QImg
|
||||||
|
:src="media.url"
|
||||||
|
class="rounded-borders cursor-pointer fit"
|
||||||
|
@click="openDialog(media.dmsFk)"
|
||||||
|
v-if="!media.isVideo"
|
||||||
|
>
|
||||||
|
</QImg>
|
||||||
|
<video
|
||||||
|
:src="media.url"
|
||||||
|
class="rounded-borders cursor-pointer fit"
|
||||||
|
muted="muted"
|
||||||
|
v-if="media.isVideo"
|
||||||
|
@click="openDialog(media.dmsFk)"
|
||||||
|
/>
|
||||||
|
</QCard>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</QCard>
|
||||||
<QCard class="vn-two" v-if="developments.length > 0">
|
<QCard class="vn-two" v-if="developments.length > 0">
|
||||||
<VnTitle
|
<VnTitle
|
||||||
:url="claimUrl + 'development'"
|
:url="claimUrl + 'development'"
|
||||||
|
@ -302,49 +344,6 @@ function openDialog(dmsId) {
|
||||||
</template>
|
</template>
|
||||||
</QTable>
|
</QTable>
|
||||||
</QCard>
|
</QCard>
|
||||||
<QCard class="vn-max" v-if="claimDms.length > 0">
|
|
||||||
<VnTitle
|
|
||||||
:url="`#/claim/${entityId}/photos`"
|
|
||||||
:text="t('claim.summary.photos')"
|
|
||||||
/>
|
|
||||||
<div class="container">
|
|
||||||
<div
|
|
||||||
class="multimedia-container"
|
|
||||||
v-for="(media, index) of claimDms"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<div class="relative-position">
|
|
||||||
<QIcon
|
|
||||||
name="play_circle"
|
|
||||||
color="primary"
|
|
||||||
size="xl"
|
|
||||||
class="absolute-center zindex"
|
|
||||||
v-if="media.isVideo"
|
|
||||||
@click.stop="openDialog(media.dmsFk)"
|
|
||||||
>
|
|
||||||
<QTooltip>Video</QTooltip>header
|
|
||||||
</QIcon>
|
|
||||||
<QCard class="multimedia relative-position">
|
|
||||||
<QImg
|
|
||||||
:src="media.url"
|
|
||||||
class="rounded-borders cursor-pointer fit"
|
|
||||||
@click="openDialog(media.dmsFk)"
|
|
||||||
v-if="!media.isVideo"
|
|
||||||
>
|
|
||||||
</QImg>
|
|
||||||
<video
|
|
||||||
:src="media.url"
|
|
||||||
class="rounded-borders cursor-pointer fit"
|
|
||||||
muted="muted"
|
|
||||||
v-if="media.isVideo"
|
|
||||||
@click="openDialog(media.dmsFk)"
|
|
||||||
/>
|
|
||||||
</QCard>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</QCard>
|
|
||||||
|
|
||||||
<QCard class="vn-max">
|
<QCard class="vn-max">
|
||||||
<VnTitle :url="claimUrl + 'action'" :text="t('claim.summary.actions')" />
|
<VnTitle :url="claimUrl + 'action'" :text="t('claim.summary.actions')" />
|
||||||
<div id="slider-container" class="q-px-xl q-py-md">
|
<div id="slider-container" class="q-px-xl q-py-md">
|
||||||
|
|
Loading…
Reference in New Issue