refs #6336 feat(claim): improvements #288
|
@ -24,6 +24,10 @@ const $props = defineProps({
|
|||
type: String,
|
||||
default: '',
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 20,
|
||||
alexm marked this conversation as resolved
|
||||
},
|
||||
saveUrl: {
|
||||
type: String,
|
||||
default: null,
|
||||
|
@ -76,6 +80,7 @@ defineExpose({
|
|||
reset,
|
||||
hasChanges,
|
||||
saveChanges,
|
||||
getChanges,
|
||||
});
|
||||
|
||||
async function fetch(data) {
|
||||
|
@ -260,6 +265,7 @@ watch(formUrl, async () => {
|
|||
<template>
|
||||
<VnPaginate
|
||||
:url="url"
|
||||
:limit="limit"
|
||||
v-bind="$attrs"
|
||||
@on-fetch="fetch"
|
||||
:skeleton="false"
|
||||
|
|
|
@ -75,7 +75,7 @@ async function insert() {
|
|||
<QPageSticky position="bottom-right" :offset="[25, 25]" v-if="addNote">
|
||||
<QBtn color="primary" icon="add" size="lg" round @click="noteModal = true" />
|
||||
</QPageSticky>
|
||||
<QDialog v-model="noteModal" @hide="newNote = ''">
|
||||
<QDialog v-model="noteModal" @hide="newNote = ''" persistent>
|
||||
<QCard>
|
||||
<QCardSection>
|
||||
<QItem class="q-px-none">
|
||||
|
|
|
@ -96,8 +96,7 @@ export function useArrayData(key, userOptions) {
|
|||
});
|
||||
|
||||
const { limit } = filter;
|
||||
|
||||
hasMoreData.value = response.data.length >= limit;
|
||||
hasMoreData.value = limit && response.data.length >= limit;
|
||||
|
||||
if (append) {
|
||||
if (!store.data) store.data = [];
|
||||
|
|
|
@ -121,11 +121,6 @@ async function fetchMana() {
|
|||
mana.value = response.data;
|
||||
}
|
||||
|
||||
async function updateQuantity({ id, quantity }) {
|
||||
if (!id) return;
|
||||
await axios.patch(`ClaimBeginnings/${id}`, { quantity });
|
||||
}
|
||||
|
||||
async function updateDiscount({ saleFk, discount, canceller }) {
|
||||
const body = { salesIds: [saleFk], newDiscount: discount };
|
||||
const claimId = claim.value.ticketFk;
|
||||
|
@ -155,6 +150,10 @@ function showImportDialog() {
|
|||
})
|
||||
.onOk(() => claimLinesForm.value.reload());
|
||||
}
|
||||
|
||||
function saveWhenHasChanges() {
|
||||
claimLinesForm.value.getChanges().updates && claimLinesForm.value.onSubmit();
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
|
||||
|
@ -181,161 +180,135 @@ function showImportDialog() {
|
|||
@on-fetch="onFetchClaim"
|
||||
auto-load
|
||||
/>
|
||||
<div class="column items-center">
|
||||
<div class="list">
|
||||
<CrudModel
|
||||
data-key="ClaimLines"
|
||||
ref="claimLinesForm"
|
||||
:url="`Claims/${route.params.id}/lines`"
|
||||
save-url="ClaimBeginnings/crud"
|
||||
:filter="linesFilter"
|
||||
@on-fetch="onFetch"
|
||||
@save-changes="onFetch"
|
||||
v-model:selected="selected"
|
||||
:default-save="false"
|
||||
:default-reset="false"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QTable
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:dense="$q.screen.lt.md"
|
||||
row-key="id"
|
||||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
:grid="$q.screen.lt.md"
|
||||
>
|
||||
<template #body-cell-claimed="{ row, value }">
|
||||
<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
|
||||
v-model="scope.value"
|
||||
type="number"
|
||||
dense
|
||||
autofocus
|
||||
@keyup.enter="scope.set"
|
||||
@focus="($event) => $event.target.select()"
|
||||
/>
|
||||
</QPopupEdit>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-description="{ row, value }">
|
||||
<QTd auto-width align="right" class="text-primary">
|
||||
{{ value }}
|
||||
<ItemDescriptorProxy
|
||||
:id="row.sale.itemFk"
|
||||
></ItemDescriptorProxy>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-discount="{ row, value, rowIndex }">
|
||||
<QTd auto-width align="right" class="text-primary">
|
||||
{{ value }}
|
||||
<VnDiscount
|
||||
:quantity="row.quantity"
|
||||
:price="row.sale.price"
|
||||
:discount="row.sale.discount"
|
||||
:mana="mana"
|
||||
:promise="updateDiscount"
|
||||
:data="{ saleFk: row.sale.id, rowIndex: rowIndex }"
|
||||
@on-update="onUpdateDiscount"
|
||||
/>
|
||||
</QTd>
|
||||
</template>
|
||||
<!-- View for grid mode -->
|
||||
<template #item="props">
|
||||
<div
|
||||
class="q-mb-md col-12 grid-style-transition"
|
||||
:style="props.selected ? 'transform: scale(0.95);' : ''"
|
||||
>
|
||||
<QCard>
|
||||
<QCardSection>
|
||||
<QCheckbox v-model="props.selected" />
|
||||
</QCardSection>
|
||||
<QSeparator inset />
|
||||
<QList dense>
|
||||
<QItem
|
||||
v-for="column of props.cols"
|
||||
:key="column.name"
|
||||
>
|
||||
<QItemSection>
|
||||
<QItemLabel caption>
|
||||
{{ column.label }}
|
||||
<div class="q-pa-md">
|
||||
<CrudModel
|
||||
data-key="ClaimLines"
|
||||
ref="claimLinesForm"
|
||||
:url="`Claims/${route.params.id}/lines`"
|
||||
save-url="ClaimBeginnings/crud"
|
||||
:filter="linesFilter"
|
||||
@on-fetch="onFetch"
|
||||
@save-changes="onFetch"
|
||||
v-model:selected="selected"
|
||||
:default-save="false"
|
||||
:default-reset="false"
|
||||
auto-load
|
||||
:limit="0"
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QTable
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:dense="$q.screen.lt.md"
|
||||
row-key="id"
|
||||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
:grid="$q.screen.lt.md"
|
||||
>
|
||||
<template #body-cell-claimed="{ row }">
|
||||
<QTd auto-width align="right" class="text-primary">
|
||||
<QInput
|
||||
v-model="row.quantity"
|
||||
type="number"
|
||||
dense
|
||||
@keyup.enter="saveWhenHasChanges()"
|
||||
@blur="saveWhenHasChanges()"
|
||||
/>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-description="{ row, value }">
|
||||
<QTd auto-width align="right" class="text-primary">
|
||||
{{ value }}
|
||||
<ItemDescriptorProxy
|
||||
:id="row.sale.itemFk"
|
||||
></ItemDescriptorProxy>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-discount="{ row, value, rowIndex }">
|
||||
<QTd auto-width align="right" class="text-primary">
|
||||
{{ value }}
|
||||
<VnDiscount
|
||||
:quantity="row.quantity"
|
||||
:price="row.sale.price"
|
||||
:discount="row.sale.discount"
|
||||
:mana="mana"
|
||||
:promise="updateDiscount"
|
||||
:data="{ saleFk: row.sale.id, rowIndex: rowIndex }"
|
||||
@on-update="onUpdateDiscount"
|
||||
/>
|
||||
</QTd>
|
||||
</template>
|
||||
<!-- View for grid mode -->
|
||||
<template #item="props">
|
||||
<div
|
||||
class="q-mb-md col-12 grid-style-transition"
|
||||
:style="props.selected ? 'transform: scale(0.95);' : ''"
|
||||
>
|
||||
<QCard>
|
||||
<QCardSection>
|
||||
<QCheckbox v-model="props.selected" />
|
||||
</QCardSection>
|
||||
<QSeparator inset />
|
||||
<QList dense>
|
||||
<QItem
|
||||
v-for="column of props.cols"
|
||||
:key="column.name"
|
||||
>
|
||||
<QItemSection>
|
||||
<QItemLabel caption>
|
||||
{{ column.label }}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
<QItemSection side>
|
||||
<template v-if="column.name === 'claimed'">
|
||||
alexm marked this conversation as resolved
jsegarra
commented
Aqui estamos usando un estilo diferente que es habilitar el input en la tabla en vez del popup. Entiendo que maná sea diferente porque tiene complejidad Aqui estamos usando un estilo diferente que es habilitar el input en la tabla en vez del popup.
Entiendo que maná sea diferente porque tiene complejidad
alexm
commented
Eso ya estaba asi, que es como esta en salix Eso ya estaba asi, que es como esta en salix
|
||||
<QItemLabel class="text-primary">
|
||||
<QInput
|
||||
v-model="props.row.quantity"
|
||||
type="number"
|
||||
dense
|
||||
autofocus
|
||||
@keyup.enter="
|
||||
saveWhenHasChanges()
|
||||
"
|
||||
@blur="saveWhenHasChanges()"
|
||||
/>
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
<QItemSection side>
|
||||
<template
|
||||
v-if="column.name === 'claimed'"
|
||||
>
|
||||
<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
|
||||
v-model="scope.value"
|
||||
type="number"
|
||||
dense
|
||||
autofocus
|
||||
@keyup.enter="scope.set"
|
||||
@focus="
|
||||
($event) =>
|
||||
$event.target.select()
|
||||
"
|
||||
/>
|
||||
</QPopupEdit>
|
||||
</QItemLabel>
|
||||
</template>
|
||||
<template
|
||||
v-else-if="column.name === 'discount'"
|
||||
>
|
||||
<QItemLabel class="text-primary">
|
||||
{{ column.value }}
|
||||
<VnDiscount
|
||||
:quantity="props.row.quantity"
|
||||
:price="props.row.sale.price"
|
||||
:discount="
|
||||
props.row.sale.discount
|
||||
"
|
||||
:mana="mana"
|
||||
:promise="updateDiscount"
|
||||
:data="{
|
||||
saleFk: props.row.sale.id,
|
||||
rowIndex: props.rowIndex,
|
||||
}"
|
||||
@on-update="onUpdateDiscount"
|
||||
/>
|
||||
</QItemLabel>
|
||||
</template>
|
||||
<template v-else>
|
||||
<QItemLabel>
|
||||
{{ column.value }}
|
||||
</QItemLabel>
|
||||
</template>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QCard>
|
||||
</div>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</CrudModel>
|
||||
</div>
|
||||
</template>
|
||||
<template
|
||||
v-else-if="column.name === 'discount'"
|
||||
>
|
||||
<QItemLabel class="text-primary">
|
||||
{{ column.value }}
|
||||
<VnDiscount
|
||||
:quantity="props.row.quantity"
|
||||
:price="props.row.sale.price"
|
||||
:discount="
|
||||
props.row.sale.discount
|
||||
"
|
||||
:mana="mana"
|
||||
:promise="updateDiscount"
|
||||
:data="{
|
||||
saleFk: props.row.sale.id,
|
||||
rowIndex: props.rowIndex,
|
||||
}"
|
||||
@on-update="onUpdateDiscount"
|
||||
/>
|
||||
</QItemLabel>
|
||||
</template>
|
||||
<template v-else>
|
||||
<QItemLabel>
|
||||
{{ column.value }}
|
||||
</QItemLabel>
|
||||
</template>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QCard>
|
||||
</div>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</CrudModel>
|
||||
</div>
|
||||
|
||||
<QPageSticky position="bottom-right" :offset="[25, 25]">
|
||||
alexm marked this conversation as resolved
jsegarra
commented
Propuesta: Añadir tooltip al boton Propuesta: Añadir tooltip al boton
|
||||
|
|
|
@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n';
|
|||
import { useRoute } from 'vue-router';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import { toDate, toCurrency, toPercentage } from 'filters/index';
|
||||
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||
import axios from 'axios';
|
||||
|
||||
defineEmits([...useDialogPluginComponent.emits]);
|
||||
|
@ -118,7 +119,6 @@ function cancel() {
|
|||
<QBtn icon="close" flat round dense v-close-popup />
|
||||
</QCardSection>
|
||||
<QTable
|
||||
class="my-sticky-header-table"
|
||||
:columns="columns"
|
||||
:rows="claimableSales"
|
||||
row-key="saleFk"
|
||||
|
@ -126,7 +126,14 @@ function cancel() {
|
|||
v-model:selected="selected"
|
||||
square
|
||||
flat
|
||||
/>
|
||||
>
|
||||
alexm marked this conversation as resolved
jsegarra
commented
Se que no aplica pero al darle a confirmar, el texto del alert está en inglés Se que no aplica pero al darle a confirmar, el texto del alert está en inglés
alexm
commented
Esta ya con la traduccion: Esta ya con la traduccion:
`:label="t('globals.confirm')"`
|
||||
<template #body-cell-description="{ row, value }">
|
||||
<QTd auto-width align="right" class="link">
|
||||
{{ value }}
|
||||
<ItemDescriptorProxy :id="row.itemFk"></ItemDescriptorProxy>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
<QSeparator />
|
||||
<QCardActions align="right">
|
||||
<QBtn :label="t('globals.cancel')" color="primary" flat @click="cancel" />
|
||||
alexm marked this conversation as resolved
jsegarra
commented
Propuesta: Desactivar el botón si no hay registros seleccionados Propuesta: Desactivar el botón si no hay registros seleccionados
|
||||
|
@ -148,33 +155,6 @@ function cancel() {
|
|||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
alexm
commented
No hacian falta No hacian falta
|
||||
.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>
|
||||
es:
|
||||
Available sales lines: Líneas de venta disponibles
|
||||
|
|
|
@ -222,23 +222,11 @@ function openDialog(dmsId) {
|
|||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
:label="t('claim.summary.pickup')"
|
||||
:value="t(`claim.summary.${claim.pickup}`)"
|
||||
:label="t('claim.basicData.pickup')"
|
||||
alexm
commented
estaban mal estaban mal
|
||||
:value="t(`claim.basicData.${claim.pickup}`)"
|
||||
/>
|
||||
</QCard>
|
||||
<QCard class="vn-three">
|
||||
<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">
|
||||
<QCard class="vn-three" v-if="salesClaimed.length > 0">
|
||||
<VnTitle
|
||||
:url="`#/claim/${entityId}/lines`"
|
||||
:text="t('claim.summary.details')"
|
||||
|
@ -280,6 +268,60 @@ function openDialog(dmsId) {
|
|||
</template>
|
||||
</QTable>
|
||||
</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">
|
||||
alexm
commented
Movido Movido
|
||||
<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">
|
||||
<VnTitle
|
||||
:url="claimUrl + 'development'"
|
||||
|
@ -302,49 +344,6 @@ function openDialog(dmsId) {
|
|||
</template>
|
||||
</QTable>
|
||||
</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">
|
||||
<VnTitle :url="claimUrl + 'action'" :text="t('claim.summary.actions')" />
|
||||
<div id="slider-container" class="q-px-xl q-py-md">
|
||||
|
|
Loading…
Reference in New Issue
20 por algun motivo?
Quiero decir, tenemos 2 ocurrencias de prop a 10 y otras 2 a 20
No es significativo, no?