Edit in grid mode
gitea/salix-front/pipeline/head There was a failure building this commit
Details
gitea/salix-front/pipeline/head There was a failure building this commit
Details
This commit is contained in:
parent
9a7be5f217
commit
438ee55b50
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { onMounted, onUnmounted, ref, computed } from 'vue';
|
||||
import { onMounted, ref, computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toCurrency } from 'filters/index';
|
||||
|
||||
|
|
|
@ -53,7 +53,7 @@ async function confirm() {
|
|||
<template>
|
||||
<q-dialog ref="dialogRef" persistent>
|
||||
<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
|
||||
:icon="icon"
|
||||
color="primary"
|
||||
|
|
|
@ -190,9 +190,9 @@ function showImportDialog() {
|
|||
}
|
||||
</script>
|
||||
<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-title> Lines </q-toolbar-title>
|
||||
<q-toolbar-title> {{ t('Claimed lines') }} </q-toolbar-title>
|
||||
<q-space />
|
||||
<div class="row q-gutter-md">
|
||||
<div>
|
||||
|
@ -240,7 +240,7 @@ function showImportDialog() {
|
|||
:grid="$q.screen.lt.md"
|
||||
>
|
||||
<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>
|
||||
|
||||
<q-popup-edit
|
||||
|
@ -248,6 +248,7 @@ function showImportDialog() {
|
|||
v-slot="scope"
|
||||
:title="t('Claimed quantity')"
|
||||
@update:model-value="updateQuantity(row)"
|
||||
buttons
|
||||
>
|
||||
<q-input
|
||||
v-model="scope.value"
|
||||
|
@ -257,31 +258,12 @@ function showImportDialog() {
|
|||
@keyup.enter="scope.set"
|
||||
@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-td>
|
||||
</template>
|
||||
|
||||
<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 }}
|
||||
<VnDiscount
|
||||
:quantity="row.quantity"
|
||||
|
@ -294,6 +276,88 @@ function showImportDialog() {
|
|||
/>
|
||||
</q-td>
|
||||
</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>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
|
@ -352,6 +416,9 @@ function showImportDialog() {
|
|||
max-width: 900px;
|
||||
width: 100%;
|
||||
}
|
||||
.grid-style-transition {
|
||||
transition: transform 0.28s, background-color 0.28s;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
|
@ -360,6 +427,7 @@ en:
|
|||
You are about to remove <strong>{count}</strong> row |
|
||||
You are about to remove <strong>{count}</strong> rows'
|
||||
es:
|
||||
Claimed lines: Líneas reclamadas
|
||||
Delivered: Entregado
|
||||
Quantity: Cantidad
|
||||
Claimed: Reclamada
|
||||
|
@ -372,7 +440,6 @@ es:
|
|||
Delete claimed sales: Eliminar ventas reclamadas
|
||||
Discount updated: Descuento actualizado
|
||||
Claimed quantity: Cantidad reclamada
|
||||
row: 'línea | líneas'
|
||||
You are about to remove {count} rows: '
|
||||
Vas a eliminar <strong>{count}</strong> línea |
|
||||
Vas a eliminar <strong>{count}</strong> líneas'
|
||||
|
|
Loading…
Reference in New Issue