5241-virtual_pos #44
|
|
@ -9,7 +9,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
### Added
|
### Added
|
||||||
|
|
||||||
- Added...
|
- (Clientes) => Añadida nueva sección "Pagos Web" para gestionar los pagos de todos los clientes
|
||||||
|
- (Tickets) => Añadida opción en el menú desplegable del ticket para enviar SMS al cliente
|
||||||
|
- (Reclamaciones) => Añadida nueva sección "Registros de auditoría"
|
||||||
|
- (Trabajadores) => Añádido módulo de trabajadores
|
||||||
|
|
|||||||
|
- (General) => Añadida barra de búsqueda general en los listados principales
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -141,8 +141,11 @@ function formatValue(value) {
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<div v-if="tags.length === 0" class="text-grey centered font-xs">
|
<div
|
||||||
{{ t(`You didn't enter any filter`) }}
|
v-if="tags.length === 0"
|
||||||
|
class="text-grey font-xs text-center full-width"
|
||||||
|
>
|
||||||
|
{{ t(`No filters applied`) }}
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<q-chip
|
<q-chip
|
||||||
|
|
@ -194,7 +197,7 @@ function formatValue(value) {
|
||||||
|
|
||||||
<i18n>
|
<i18n>
|
||||||
es:
|
es:
|
||||||
You didn't enter any filter: No has introducido ningún filtro
|
No filters applied: No se han aplicado filtros
|
||||||
|
alexandre marked this conversation as resolved
alexandre
commented
No seria millor posar les traduccions en els fitxers src/i18n/en/index.js i src/i18n/es/index.js? No seria millor posar les traduccions en els fitxers *src/i18n/en/index.js* i *src/i18n/es/index.js*?
|
|||||||
Applied filters: Filtros aplicados
|
Applied filters: Filtros aplicados
|
||||||
Remove filters: Eliminar filtros
|
Remove filters: Eliminar filtros
|
||||||
Refresh: Refrescar
|
Refresh: Refrescar
|
||||||
|
|
|
||||||
|
|
@ -51,18 +51,27 @@ const props = defineProps({
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const arrayData = useArrayData(props.dataKey, {
|
let arrayData = null;
|
||||||
url: props.url,
|
let store = null;
|
||||||
filter: props.filter,
|
|
||||||
where: props.where,
|
|
||||||
limit: props.limit,
|
|
||||||
order: props.order,
|
|
||||||
userParams: props.userParams,
|
|
||||||
});
|
|
||||||
const store = arrayData.store;
|
|
||||||
const searchText = ref('');
|
const searchText = ref('');
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
const options = {};
|
||||||
|
if (props.url) {
|
||||||
|
options.url = props.url;
|
||||||
|
}
|
||||||
|
if (props.filter) {
|
||||||
|
options.filter = props.filter;
|
||||||
|
}
|
||||||
|
|
||||||
|
// url: props.url,
|
||||||
|
// filter: props.filter,
|
||||||
|
// where: props.where,
|
||||||
|
// limit: props.limit,
|
||||||
|
// order: props.order,
|
||||||
|
// userParams: props.userParams,
|
||||||
|
arrayData = useArrayData(props.dataKey, options);
|
||||||
|
store = arrayData.store;
|
||||||
const params = store.userParams;
|
const params = store.userParams;
|
||||||
if (params && params.search) {
|
if (params && params.search) {
|
||||||
searchText.value = params.search;
|
searchText.value = params.search;
|
||||||
|
|
|
||||||
|
|
@ -61,6 +61,7 @@ export default {
|
||||||
customers: 'Customers',
|
customers: 'Customers',
|
||||||
list: 'List',
|
list: 'List',
|
||||||
createCustomer: 'Create customer',
|
createCustomer: 'Create customer',
|
||||||
|
webPayments: 'Web Payments',
|
||||||
summary: 'Summary',
|
summary: 'Summary',
|
||||||
basicData: 'Basic Data',
|
basicData: 'Basic Data',
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -61,8 +61,9 @@ export default {
|
||||||
customers: 'Clientes',
|
customers: 'Clientes',
|
||||||
list: 'Listado',
|
list: 'Listado',
|
||||||
createCustomer: 'Crear cliente',
|
createCustomer: 'Crear cliente',
|
||||||
summary: 'Resumen',
|
|
||||||
basicData: 'Datos básicos',
|
basicData: 'Datos básicos',
|
||||||
|
summary: 'Resumen',
|
||||||
|
webPayments: 'Web Payments'
|
||||||
},
|
},
|
||||||
list: {
|
list: {
|
||||||
phone: 'Teléfono',
|
phone: 'Teléfono',
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,245 @@
|
||||||
|
<script setup>
|
||||||
|
import axios from 'axios';
|
||||||
|
import { ref, computed } from 'vue';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
import { useQuasar } from 'quasar';
|
||||||
|
import { useStateStore } from 'stores/useStateStore';
|
||||||
|
import Paginate from 'components/PaginateData.vue';
|
||||||
|
import VnConfirm from 'components/ui/VnConfirm.vue';
|
||||||
|
import CustomerDescriptorProxy from './Card/CustomerDescriptorProxy.vue';
|
||||||
|
import { toDate, toCurrency } from 'filters';
|
||||||
|
import CustomerPaymentsFilter from './CustomerPaymentsFilter.vue';
|
||||||
|
|
||||||
|
const stateStore = useStateStore();
|
||||||
|
const quasar = useQuasar();
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
async function confirm(transaction) {
|
||||||
|
quasar
|
||||||
|
.dialog({
|
||||||
|
component: VnConfirm,
|
||||||
|
componentProps: {
|
||||||
|
data: transaction,
|
||||||
|
title: t('Confirm transaction'),
|
||||||
|
promise: confirmTransaction,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.onOk((row) => (row.isConfirmed = true));
|
||||||
|
}
|
||||||
|
|
||||||
|
async function confirmTransaction(transaction) {
|
||||||
|
const body = { id: transaction.id };
|
||||||
|
await axios.post('Clients/confirmTransaction', body);
|
||||||
|
alexandre
commented
és correcte passar-li com a parametre el id dins de claus? és correcte passar-li com a parametre el id dins de claus?
joan
commented
Si, el parámetre que li arriva es un objecte data, i ahí el que estic fent es desestructurar el objecte per a extraure directament les propietats Igual com fer
Si, el parámetre que li arriva es un objecte data, i ahí el que estic fent es desestructurar el objecte per a extraure directament les propietats
Igual com fer
`const { id } = data`
|
|||||||
|
quasar.notify({
|
||||||
|
message: 'Transaction confirmed',
|
||||||
|
type: 'positive',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const grid = ref(false);
|
||||||
|
const columns = computed(() => [
|
||||||
|
{
|
||||||
|
name: 'id',
|
||||||
|
label: t('Transaction ID'),
|
||||||
|
field: (row) => row.id,
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'customerId',
|
||||||
|
label: t('Customer ID'),
|
||||||
|
field: (row) => row.clientFk,
|
||||||
|
align: 'right',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'customer',
|
||||||
|
label: t('Customer Name'),
|
||||||
|
field: (row) => row.customerName,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'state',
|
||||||
|
label: t('State'),
|
||||||
|
field: (row) => row.isConfirmed,
|
||||||
|
format: (value) => (value ? t('Confirmed') : t('Unconfirmed')),
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'dated',
|
||||||
|
label: t('Dated'),
|
||||||
|
field: (row) => toDate(row.created),
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'amount',
|
||||||
|
label: t('Amount'),
|
||||||
|
field: (row) => row.amount,
|
||||||
|
format: (value) => toCurrency(value),
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'actions',
|
||||||
|
label: t('Actions'),
|
||||||
|
grid: false,
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<template v-if="stateStore.isHeaderMounted()">
|
||||||
|
<Teleport to="#actions-append">
|
||||||
|
<div class="row q-gutter-x-sm">
|
||||||
|
<q-btn
|
||||||
|
flat
|
||||||
|
@click="stateStore.toggleRightDrawer()"
|
||||||
|
round
|
||||||
|
dense
|
||||||
|
icon="menu"
|
||||||
|
>
|
||||||
|
<q-tooltip bottom anchor="bottom right">
|
||||||
|
{{ t('globals.collapseMenu') }}
|
||||||
|
</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</div>
|
||||||
|
</Teleport>
|
||||||
|
</template>
|
||||||
|
<q-drawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||||
|
<q-scroll-area class="fit text-grey-8">
|
||||||
|
<CustomerPaymentsFilter data-key="CustomerTransactions" />
|
||||||
|
</q-scroll-area>
|
||||||
|
</q-drawer>
|
||||||
|
<q-page class="column items-center q-pa-md">
|
||||||
|
<div class="card-list">
|
||||||
|
<q-toolbar class="q-pa-none">
|
||||||
|
<q-toolbar-title>Web Payments</q-toolbar-title>
|
||||||
|
<q-btn icon="refresh" color="primary" class="q-mr-sm" round dense></q-btn>
|
||||||
|
<q-btn @click="grid = !grid" icon="list" color="primary" round dense>
|
||||||
|
<q-tooltip>Change view</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-toolbar>
|
||||||
|
<paginate
|
||||||
|
data-key="CustomerTransactions"
|
||||||
|
url="/Clients"
|
||||||
|
order="created DESC"
|
||||||
|
:limit="20"
|
||||||
|
:offset="50"
|
||||||
|
auto-load
|
||||||
|
>
|
||||||
|
<template #body="{ rows }">
|
||||||
|
<q-table
|
||||||
|
:dense="$q.screen.lt.md"
|
||||||
|
:columns="columns"
|
||||||
|
:rows="rows"
|
||||||
|
row-key="id"
|
||||||
|
hide-pagination
|
||||||
|
:pagination="{ rowsPerPage: 0 }"
|
||||||
|
:grid="grid || $q.screen.lt.sm"
|
||||||
|
>
|
||||||
|
<template #body-cell-actions="{ row }">
|
||||||
|
<q-td auto-width class="text-center">
|
||||||
|
<q-btn
|
||||||
|
v-if="!row.isConfirmed"
|
||||||
|
icon="check"
|
||||||
|
@click="confirm(row)"
|
||||||
|
color="primary"
|
||||||
|
size="md"
|
||||||
|
round
|
||||||
|
flat
|
||||||
|
dense
|
||||||
|
>
|
||||||
|
<q-tooltip>{{ t('Confirm transaction') }}</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-td>
|
||||||
|
</template>
|
||||||
|
<template #body-cell-customerId="{ row }">
|
||||||
|
<q-td align="right">
|
||||||
|
<span class="link">
|
||||||
|
{{ row.clientFk }}
|
||||||
|
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||||
|
</span>
|
||||||
|
</q-td>
|
||||||
|
</template>
|
||||||
|
<template #item="{ cols, row }">
|
||||||
|
<div class="q-mb-md col-12">
|
||||||
|
<q-card>
|
||||||
|
<q-item class="q-pa-none items-start">
|
||||||
|
<q-item-section class="q-pa-md">
|
||||||
|
<q-list>
|
||||||
|
<template
|
||||||
|
v-for="col of cols"
|
||||||
|
:key="col.name"
|
||||||
|
>
|
||||||
|
<q-item
|
||||||
|
v-if="col.grid !== false"
|
||||||
|
class="q-pa-none"
|
||||||
|
>
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label caption>
|
||||||
|
{{ col.label }}
|
||||||
|
</q-item-label>
|
||||||
|
<q-item-label>
|
||||||
|
{{ col.value }}
|
||||||
|
</q-item-label>
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</template>
|
||||||
|
</q-list>
|
||||||
|
<!-- <q-list>
|
||||||
|
<q-item class="q-pa-none">
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label caption>
|
||||||
|
<q-skeleton />
|
||||||
|
</q-item-label>
|
||||||
|
<q-item-label
|
||||||
|
><q-skeleton type="text"
|
||||||
|
/></q-item-label>
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</q-list> -->
|
||||||
|
</q-item-section>
|
||||||
|
<q-separator vertical />
|
||||||
|
<q-card-actions vertical class="justify-between">
|
||||||
|
<q-btn
|
||||||
|
v-if="!row.isConfirmed"
|
||||||
|
icon="check"
|
||||||
|
@click="confirm(row)"
|
||||||
|
color="primary"
|
||||||
|
size="md"
|
||||||
|
round
|
||||||
|
flat
|
||||||
|
dense
|
||||||
|
>
|
||||||
|
<q-tooltip>{{
|
||||||
|
t('Confirm transaction')
|
||||||
|
}}</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-card-actions>
|
||||||
|
</q-item>
|
||||||
|
</q-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</q-table>
|
||||||
|
</template>
|
||||||
|
</paginate>
|
||||||
|
</div>
|
||||||
|
</q-page>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.card-list {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 60em;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<i18n>
|
||||||
|
es:
|
||||||
|
Confirm transaction: Confirmar transacción
|
||||||
|
Transaction ID: ID transacción
|
||||||
|
Customer ID: ID cliente
|
||||||
|
Customer Name: Nombre cliente
|
||||||
|
State: Estado
|
||||||
|
Dated: Fecha
|
||||||
|
Amount: Importe
|
||||||
|
Actions: Acciones
|
||||||
|
Confirmed: Confirmada
|
||||||
|
Unconfirmed: Sin confirmar
|
||||||
|
</i18n>
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
<script setup>
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||||
|
|
||||||
|
const { t } = useI18n();
|
||||||
|
const props = defineProps({
|
||||||
|
dataKey: {
|
||||||
|
type: String,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||||
|
<template #tags="{ tag, formatFn }">
|
||||||
|
<div class="q-gutter-x-xs">
|
||||||
|
<strong>{{ t(`params.${tag.label}`) }}: </strong>
|
||||||
|
<span>{{ formatFn(tag.value) }}</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #body="{ params }">
|
||||||
|
<q-list dense>
|
||||||
|
<q-item>
|
||||||
|
<q-item-section>
|
||||||
|
<q-input
|
||||||
|
:label="t('Order ID')"
|
||||||
|
v-model="params.orderFk"
|
||||||
|
lazy-rules
|
||||||
|
>
|
||||||
|
<template #prepend>
|
||||||
|
<q-icon name="vn:basket" size="sm"></q-icon>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
<q-item>
|
||||||
|
<q-item-section>
|
||||||
|
<q-input
|
||||||
|
:label="t('Customer ID')"
|
||||||
|
v-model="params.clientFk"
|
||||||
|
lazy-rules
|
||||||
|
>
|
||||||
|
<template #prepend>
|
||||||
|
<q-icon name="vn:client" size="sm"></q-icon>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
<q-item>
|
||||||
|
<q-item-section>
|
||||||
|
<q-input :label="t('Amount')" v-model="params.amount" lazy-rules>
|
||||||
|
<template #prepend>
|
||||||
|
<q-icon name="euro" size="sm"></q-icon>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</q-list>
|
||||||
|
</template>
|
||||||
|
</VnFilterPanel>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<i18n>
|
||||||
|
en:
|
||||||
|
params:
|
||||||
|
orderFk: Order
|
||||||
|
clientFk: Customer
|
||||||
|
amount: Amount
|
||||||
|
es:
|
||||||
|
params:
|
||||||
|
orderFk: Pedido
|
||||||
|
clientFk: Cliente
|
||||||
|
amount: Importe
|
||||||
|
Order ID: ID pedido
|
||||||
|
Customer ID: ID cliente
|
||||||
|
Amount: Importe
|
||||||
|
</i18n>
|
||||||
|
|
@ -10,7 +10,7 @@ export default {
|
||||||
component: RouterView,
|
component: RouterView,
|
||||||
redirect: { name: 'CustomerMain' },
|
redirect: { name: 'CustomerMain' },
|
||||||
menus: {
|
menus: {
|
||||||
main: ['CustomerList', 'CustomerCreate'],
|
main: ['CustomerList', 'CustomerPayments', 'CustomerCreate'],
|
||||||
card: ['CustomerBasicData'],
|
card: ['CustomerBasicData'],
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
|
|
@ -29,6 +29,15 @@ export default {
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Customer/CustomerList.vue')
|
component: () => import('src/pages/Customer/CustomerList.vue')
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'payments',
|
||||||
|
name: 'CustomerPayments',
|
||||||
|
meta: {
|
||||||
|
title: 'webPayments',
|
||||||
|
icon: 'vn:onlinepayment',
|
||||||
|
},
|
||||||
|
component: () => import('src/pages/Customer/CustomerPayments.vue')
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: 'create',
|
path: 'create',
|
||||||
name: 'CustomerCreate',
|
name: 'CustomerCreate',
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Llevar accent en añadido