verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 59 Releases Wiki Activity

Edit in grid mode
gitea/salix-front/pipeline/head There was a failure building this commit Details

This commit is contained in:
Joan Sanchez 2023-03-28 14:58:04 +02:00
parent 9a7be5f217
commit 438ee55b50
3 changed files with 93 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/common/vnDiscount.vue
View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { onMounted, onUnmounted, ref, computed } from 'vue'; import { onMounted, ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { toCurrency } from 'filters/index'; import { toCurrency } from 'filters/index';

2
src/components/ui/VnConfirm.vue
View File

@ -53,7 +53,7 @@ async function confirm() {
<template> <template>
<q-dialog ref="dialogRef" persistent> <q-dialog ref="dialogRef" persistent>
<q-card class="q-pa-sm"> <q-card class="q-pa-sm">
<q-card-section class="row items-center q-pb-none q-gutter-md"> <q-card-section class="row items-center q-pb-none">
<q-avatar <q-avatar
:icon="icon" :icon="icon"
color="primary" color="primary"

115
src/pages/Claim/Card/ClaimLines.vue
View File

@ -190,9 +190,9 @@ function showImportDialog() {
} }
</script> </script>
<template> <template>
<q-page-sticky position="top" :offset="[0, 0]" expand> <q-page-sticky class="z-top" position="top" :offset="[0, 0]" expand>
<q-toolbar class="bg-dark text-white"> <q-toolbar class="bg-dark text-white">
<q-toolbar-title> Lines </q-toolbar-title> <q-toolbar-title> {{ t('Claimed lines') }} </q-toolbar-title>
<q-space /> <q-space />
<div class="row q-gutter-md"> <div class="row q-gutter-md">
<div> <div>
@ -240,7 +240,7 @@ function showImportDialog() {
:grid="$q.screen.lt.md" :grid="$q.screen.lt.md"
> >
<template #body-cell-claimed="{ row, value }"> <template #body-cell-claimed="{ row, value }">
<q-td auto-width align="right" class="dimmed"> <q-td auto-width align="right" class="text-primary">
<span>{{ value }}</span> <span>{{ value }}</span>
<q-popup-edit <q-popup-edit
@ -248,6 +248,7 @@ function showImportDialog() {
v-slot="scope" v-slot="scope"
:title="t('Claimed quantity')" :title="t('Claimed quantity')"
@update:model-value="updateQuantity(row)" @update:model-value="updateQuantity(row)"
buttons
> >
<q-input <q-input
v-model="scope.value" v-model="scope.value"
@ -257,31 +258,12 @@ function showImportDialog() {
@keyup.enter="scope.set" @keyup.enter="scope.set"
@focus="($event) => $event.target.select()" @focus="($event) => $event.target.select()"
/> />
<q-card-actions
class="q-px-none q-mt-sm"
align="right"
>
<q-btn
:label="t('Cancel')"
color="primary"
flat
@click="cancel(scope)"
/>
<q-btn
:label="t('Update')"
color="primary"
:loading="isLoading"
unelevated
@click="save(scope)"
/>
</q-card-actions>
</q-popup-edit> </q-popup-edit>
</q-td> </q-td>
</template> </template>
<template #body-cell-discount="{ row, value, rowIndex }"> <template #body-cell-discount="{ row, value, rowIndex }">
<q-td auto-width align="right" class="dimmed"> <q-td auto-width align="right" class="text-primary">
{{ value }} {{ value }}
<VnDiscount <VnDiscount
:quantity="row.quantity" :quantity="row.quantity"
@ -294,6 +276,88 @@ function showImportDialog() {
/> />
</q-td> </q-td>
</template> </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);' : ''"
>
<q-card>
<q-card-section>
<q-checkbox v-model="props.selected" />
</q-card-section>
<q-separator inset />
<q-list dense>
<q-item
v-for="column of props.cols"
:key="column.name"
>
<q-item-section>
<q-item-label caption>
{{ column.label }}
</q-item-label>
</q-item-section>
<q-item-section side>
<template
v-if="column.name === 'claimed'"
>
<q-item-label class="text-primary">
{{ column.value }}
<q-popup-edit
v-model="props.row.quantity"
v-slot="scope"
:title="t('Claimed quantity')"
@update:model-value="
updateQuantity(props.row)
"
buttons
>
<q-input
v-model="scope.value"
type="number"
dense
autofocus
@keyup.enter="scope.set"
@focus="
($event) =>
$event.target.select()
"
/>
</q-popup-edit>
</q-item-label>
</template>
<template
v-else-if="column.name === 'discount'"
>
<q-item-label 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"
/>
</q-item-label>
</template>
<template v-else>
<q-item-label>
{{ column.value }}
</q-item-label>
</template>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</template>
</q-table> </q-table>
</template> </template>
</VnPaginate> </VnPaginate>
@ -352,6 +416,9 @@ function showImportDialog() {
max-width: 900px; max-width: 900px;
width: 100%; width: 100%;
} }
.grid-style-transition {
transition: transform 0.28s, background-color 0.28s;
}
</style> </style>
<i18n> <i18n>
@ -360,6 +427,7 @@ en:
You are about to remove <strong>{count}</strong> row | You are about to remove <strong>{count}</strong> row |
You are about to remove <strong>{count}</strong> rows' You are about to remove <strong>{count}</strong> rows'
es: es:
Claimed lines: Líneas reclamadas
Delivered: Entregado Delivered: Entregado
Quantity: Cantidad Quantity: Cantidad
Claimed: Reclamada Claimed: Reclamada
@ -372,7 +440,6 @@ es:
Delete claimed sales: Eliminar ventas reclamadas Delete claimed sales: Eliminar ventas reclamadas
Discount updated: Descuento actualizado Discount updated: Descuento actualizado
Claimed quantity: Cantidad reclamada Claimed quantity: Cantidad reclamada
row: 'línea | líneas'
You are about to remove {count} rows: ' You are about to remove {count} rows: '
Vas a eliminar <strong>{count}</strong> línea | Vas a eliminar <strong>{count}</strong> línea |
Vas a eliminar <strong>{count}</strong> líneas' Vas a eliminar <strong>{count}</strong> líneas'