forked from juan/hedera-web
Order checkout
This commit is contained in:
parent
29acd913ee
commit
703d6932ff
|
@ -1,6 +1,50 @@
|
|||
const warehouseIds = [1, 44];
|
||||
|
||||
module.exports = Self => {
|
||||
Self.remoteMethod('calcCatalog', {
|
||||
description: 'Get the available and prices list for an item',
|
||||
accessType: 'READ',
|
||||
accepts: [
|
||||
{
|
||||
arg: 'id',
|
||||
type: 'Number',
|
||||
description: 'The item id'
|
||||
}, {
|
||||
arg: 'dated',
|
||||
type: 'Date',
|
||||
description: 'The date'
|
||||
}, {
|
||||
arg: 'addressFk',
|
||||
type: 'Number',
|
||||
description: 'The address id'
|
||||
}, {
|
||||
arg: 'agencyModeFk',
|
||||
type: 'Number',
|
||||
description: 'The agency id'
|
||||
}
|
||||
],
|
||||
returns: {
|
||||
type: ['Object'],
|
||||
description: 'The item available and prices list',
|
||||
root: true,
|
||||
},
|
||||
http: {
|
||||
path: `/:id/calcCatalog`,
|
||||
verb: 'GET'
|
||||
}
|
||||
});
|
||||
|
||||
Self.calcCatalog = (id, dated, addressFk, agencyModeFk, cb) => {
|
||||
Self.dataSource.connector.query(
|
||||
`CALL hedera.item_calcCatalog(?, ?, ?, ?)`,
|
||||
[id, dated, addressFk, agencyModeFk],
|
||||
(err, res) => {
|
||||
if (err) return cb(err)
|
||||
return cb(null, res[0])
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
Self.remoteMethod('catalog', {
|
||||
description: 'Get the catalog',
|
||||
accessType: 'READ',
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
"base": "PersistedModel",
|
||||
"options": {
|
||||
"mysql": {
|
||||
"table": "hedera.orderRow"
|
||||
"table": "hedera.orderRow"
|
||||
}
|
||||
},
|
||||
"properties": {
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
"base": "PersistedModel",
|
||||
"options": {
|
||||
"mysql": {
|
||||
"table": "hedera.order"
|
||||
"table": "hedera.order"
|
||||
}
|
||||
},
|
||||
"properties": {
|
||||
|
@ -79,9 +79,23 @@
|
|||
"mysql": {
|
||||
"columnName": "confirm_date"
|
||||
}
|
||||
},
|
||||
"taxableBase": {
|
||||
"type": "Number"
|
||||
},
|
||||
"tax": {
|
||||
"type": "Number"
|
||||
},
|
||||
"total": {
|
||||
"type": "Number"
|
||||
}
|
||||
},
|
||||
"relations": {
|
||||
"rows": {
|
||||
"type": "hasMany",
|
||||
"model": "OrderRow",
|
||||
"foreignKey": "orderFk"
|
||||
},
|
||||
"agencyMode": {
|
||||
"type": "belongsTo",
|
||||
"model": "AgencyMode",
|
||||
|
@ -101,11 +115,6 @@
|
|||
"type": "belongsTo",
|
||||
"model": "DeliveryMethod",
|
||||
"foreignKey": "delivery_method_id"
|
||||
},
|
||||
"rows": {
|
||||
"type": "hasMany",
|
||||
"model": "OrderRow",
|
||||
"foreignKey": "orderFk"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -52,6 +52,7 @@ module.exports = function (ctx) {
|
|||
'QItemLabel',
|
||||
'QList',
|
||||
'QLayout',
|
||||
'QMarkupTable',
|
||||
'QPageContainer',
|
||||
'QPage',
|
||||
'QPageSticky',
|
||||
|
@ -79,8 +80,8 @@ module.exports = function (ctx) {
|
|||
'ClosePopup'
|
||||
],
|
||||
|
||||
// Quasar plugins
|
||||
plugins: [
|
||||
'Dialog',
|
||||
'Notify'
|
||||
]
|
||||
|
||||
|
|
|
@ -6,7 +6,7 @@ export default async ({ app, Vue }) => {
|
|||
let i18n = app.i18n
|
||||
|
||||
function currency (val) {
|
||||
return val ? val.toFixed(2) + '€' : val
|
||||
return typeof val === 'number' ? val.toFixed(2) + '€' : val
|
||||
}
|
||||
|
||||
function date (val, format) {
|
||||
|
|
|
@ -9,7 +9,11 @@ export default async ({ app, Vue }) => {
|
|||
title: null,
|
||||
subtitle: null,
|
||||
useRightDrawer: false,
|
||||
rightDrawerOpen: true
|
||||
rightDrawerOpen: true,
|
||||
catalogConfig: {
|
||||
agencyModeFk: 2,
|
||||
addressFk: 1823
|
||||
}
|
||||
})
|
||||
Vue.prototype.$state = state
|
||||
}
|
||||
|
|
|
@ -115,7 +115,7 @@ export default {
|
|||
params.filter = filter
|
||||
limit = filter.limit
|
||||
|
||||
if (!limit) {
|
||||
if (limit === undefined) {
|
||||
limit = this.index * 30
|
||||
filter.limit = limit
|
||||
}
|
||||
|
@ -149,7 +149,7 @@ export default {
|
|||
this.doRequest()
|
||||
.then(res => {
|
||||
if (!res) return done(true)
|
||||
done(!res.limit || res.data.length < res.limit)
|
||||
done(!res.limit || !Array.isArray(res.data) || res.data.length < res.limit)
|
||||
return res
|
||||
})
|
||||
.catch(err => {
|
||||
|
|
|
@ -1,9 +1,5 @@
|
|||
export default {
|
||||
// Login
|
||||
enter: 'Enter',
|
||||
email: 'E-Mail',
|
||||
password: 'Password',
|
||||
remember: 'Don not close session',
|
||||
// global
|
||||
search: 'Search',
|
||||
accept: 'Accept',
|
||||
cancel: 'Cancel',
|
||||
|
@ -22,6 +18,7 @@ export default {
|
|||
createdSuccess: 'Item created successfully',
|
||||
fieldIsRequired: 'Field is required',
|
||||
setSearchFilter: 'Please, set a search filter',
|
||||
id: 'Id',
|
||||
today: 'Today',
|
||||
yesterday: 'Yesterday',
|
||||
tomorrow: 'Tomorrow',
|
||||
|
@ -81,7 +78,13 @@ export default {
|
|||
logout: 'Logout',
|
||||
visitor: 'Visitor',
|
||||
|
||||
// Menu
|
||||
// login
|
||||
enter: 'Enter',
|
||||
email: 'E-Mail',
|
||||
password: 'Password',
|
||||
remember: 'Don not close session',
|
||||
|
||||
// menu
|
||||
home: 'Home',
|
||||
catalog: 'Catalog',
|
||||
orders: 'Orders',
|
||||
|
@ -104,7 +107,7 @@ export default {
|
|||
addressEdit: 'Edit address',
|
||||
register: 'Register',
|
||||
|
||||
// Home
|
||||
// home
|
||||
recentNews: 'Recent news',
|
||||
startOrder: 'Start order',
|
||||
|
||||
|
@ -123,7 +126,7 @@ export default {
|
|||
n1InPrice: 'Nº1 in price',
|
||||
ourBigVolumeAllows: 'our big volume allows us to offer the best prices',
|
||||
|
||||
// Catalog
|
||||
// catalog
|
||||
more: 'More',
|
||||
noItemsFound: 'No items found',
|
||||
pleaseSetFilter: 'Please, set a filter using the right menu',
|
||||
|
@ -146,21 +149,60 @@ export default {
|
|||
siceAsc: 'Ascending size',
|
||||
sizeDesc: 'Descencing size',
|
||||
|
||||
// Orders
|
||||
ordersMadeAt: 'Orders made at',
|
||||
pendingConfirmtion: 'Pending confirmation',
|
||||
noOrdersFound: 'No orders found',
|
||||
// orders
|
||||
pending: 'Pending',
|
||||
confirmed: 'Confirmed',
|
||||
|
||||
// orders
|
||||
pendingConfirmtion: 'Pending confirmation',
|
||||
noOrdersFound: 'No orders found',
|
||||
|
||||
// orders
|
||||
ordersMadeAt: 'Orders made at',
|
||||
packages: '{n} packages',
|
||||
|
||||
// Conditions
|
||||
// order
|
||||
total: 'Total',
|
||||
confirm: 'Confirm',
|
||||
delivery: 'Delivery date',
|
||||
address: 'Address',
|
||||
agency: 'Agency',
|
||||
warehouse: 'Warehouse',
|
||||
configure: 'Configure',
|
||||
|
||||
// order/checkout
|
||||
checkout: 'Checkout',
|
||||
orderSummary: 'Order summary',
|
||||
accountsSummary: 'Accounts summary',
|
||||
previousBalance: 'Previous balance',
|
||||
orderTotal: 'Order total',
|
||||
vat: 'VAT',
|
||||
totalDebt: 'Total debt',
|
||||
credit: 'Credit',
|
||||
exceededCredit: 'Exceeded credit',
|
||||
payAmount: 'Amount to pay',
|
||||
payMethod: 'Pay method',
|
||||
useMyBalance: 'Use my balance',
|
||||
youHaveFaborableBalance: 'You do not need to perform any payment, you have a favorable balance.',
|
||||
useMyCredit: 'Use my credit',
|
||||
youHaveFaborableCredit: 'You do not need to pay now, you have a favorable credit.',
|
||||
creditCard: 'Credit card',
|
||||
youWillRedirectToPayment: 'By confirming the order you will be redirected to the payment platform.',
|
||||
bankTransfer: 'Bank Transfer',
|
||||
makeTransfer: 'Make a transfer to the following account and send the receipt to your salesperson.',
|
||||
payLater: 'Pay later',
|
||||
doYouWantToConfirm: 'Do you want to confirm the order?',
|
||||
orderConfirmedSuccessfully: 'Your order has been confirmed successfully',
|
||||
youExceededCredit: 'You have exceeded your credit, in order to prepare your order please pay your debt.',
|
||||
notes: 'Notes',
|
||||
|
||||
// conditions
|
||||
conditionsDesc: 'The order will arrive to your home in 24/48 hours depending on which area you are.',
|
||||
|
||||
// About
|
||||
// about
|
||||
aboutDesc: 'Verdnatura offers all services for your florist.',
|
||||
|
||||
// Connections
|
||||
// connections
|
||||
nConnections: '{0} connections',
|
||||
refreshRate: 'Refresh rate',
|
||||
lastAction: 'Last actions',
|
||||
|
@ -168,27 +210,27 @@ export default {
|
|||
nSeconds: '{0} seconds',
|
||||
dontRefresh: 'Do not refresh',
|
||||
|
||||
// Visits
|
||||
// accessLog
|
||||
accessLog: 'Access log',
|
||||
|
||||
// visits
|
||||
visitsCount: '{0} visits, {1} new',
|
||||
|
||||
// New
|
||||
// new
|
||||
title: 'Title',
|
||||
image: 'Image',
|
||||
tag: 'Tag',
|
||||
priority: 'Priority',
|
||||
text: 'Text',
|
||||
|
||||
// Images
|
||||
// images
|
||||
collection: 'Collection',
|
||||
updateMatchingId: 'Update items with matching id',
|
||||
uploadAutomatically: 'Upload automatically',
|
||||
imagesUploadSuccess: 'Images uploaded successfully',
|
||||
imagesUploadFailed: 'Some images could not be uploaded',
|
||||
|
||||
// User
|
||||
accessLog: 'Access log',
|
||||
|
||||
// Config
|
||||
// user
|
||||
userName: 'Username',
|
||||
nickname: 'Nickname',
|
||||
language: 'Language',
|
||||
|
@ -207,14 +249,14 @@ export default {
|
|||
passwordsDontMatch: 'Passwords do not match',
|
||||
passwordChanged: 'Password changed successfully!',
|
||||
|
||||
// Addresses
|
||||
// addresses
|
||||
setAsDefault: 'Set as default',
|
||||
addressSetAsDefault: 'Address set as default',
|
||||
addressRemoved: 'Address removed',
|
||||
areYouSureDeleteAddress: 'Are you sure you want to delete the address?',
|
||||
addressCreated: 'Address created successfully!',
|
||||
|
||||
// Address
|
||||
// address
|
||||
consignatary: 'Consignatary',
|
||||
street: 'Street',
|
||||
city: 'City',
|
||||
|
@ -224,7 +266,7 @@ export default {
|
|||
phone: 'Phone',
|
||||
mobile: 'Mobile',
|
||||
|
||||
// Register
|
||||
// register
|
||||
registerAsNew: 'Registrarse como nuevo usuario',
|
||||
notYetUser: 'You are not yet a user, register now and start enjoying everything that Verdnatura offers you.',
|
||||
receiveOffers: 'Receive offers and promotions by e-mail',
|
||||
|
|
|
@ -1,9 +1,5 @@
|
|||
export default {
|
||||
// Login
|
||||
enter: 'Entrar',
|
||||
email: 'Correo electrónico',
|
||||
password: 'Contraseña',
|
||||
remember: 'No cerrar sesión',
|
||||
// global
|
||||
search: 'Buscar',
|
||||
accept: 'Aceptar',
|
||||
cancel: 'Cancelar',
|
||||
|
@ -22,6 +18,7 @@ export default {
|
|||
createdSuccess: 'Elemento creado correctamente',
|
||||
fieldIsRequired: 'Campo requerido',
|
||||
setSearchFilter: 'Por favor, establece un filtro de búsqueda',
|
||||
id: 'Id',
|
||||
today: 'Hoy',
|
||||
yesterday: 'Ayer',
|
||||
tomorrow: 'Mañana',
|
||||
|
@ -76,12 +73,18 @@ export default {
|
|||
]
|
||||
},
|
||||
|
||||
// Layout
|
||||
// layout
|
||||
login: 'Iniciar sesión',
|
||||
logout: 'Cerrar sesión',
|
||||
visitor: 'Visitante',
|
||||
|
||||
// Menu
|
||||
// login
|
||||
enter: 'Entrar',
|
||||
email: 'Correo electrónico',
|
||||
password: 'Contraseña',
|
||||
remember: 'No cerrar sesión',
|
||||
|
||||
// menu
|
||||
home: 'Inicio',
|
||||
catalog: 'Catálogo',
|
||||
orders: 'Pedidos',
|
||||
|
@ -104,7 +107,7 @@ export default {
|
|||
addressEdit: 'Editar dirección',
|
||||
register: 'Registrarse',
|
||||
|
||||
// Home
|
||||
// home
|
||||
recentNews: 'Noticias recientes',
|
||||
startOrder: 'Empezar pedido',
|
||||
|
||||
|
@ -123,7 +126,7 @@ export default {
|
|||
n1InPrice: 'Nº1 en precio',
|
||||
ourBigVolumeAllows: 'Nuestro gran volumen nos permite ofrecerte los mejores precios',
|
||||
|
||||
// Catalog
|
||||
// catalog
|
||||
more: 'Más',
|
||||
noItemsFound: 'No se han encontrado artículos',
|
||||
pleaseSetFilter: 'Por favor, establece un filtro usando el menú de la derecha',
|
||||
|
@ -146,21 +149,60 @@ export default {
|
|||
siceAsc: 'Medida ascendente',
|
||||
sizeDesc: 'Medida descendente',
|
||||
|
||||
// Orders
|
||||
ordersMadeAt: 'Pedidos realizados en',
|
||||
pendingConfirmtion: 'Pendientes de confirmar',
|
||||
noOrdersFound: 'No se han encontrado pedidos',
|
||||
// orders
|
||||
pending: 'Pendientes',
|
||||
confirmed: 'Confirmados',
|
||||
|
||||
// orders/pending
|
||||
pendingConfirmtion: 'Pendientes de confirmar',
|
||||
noOrdersFound: 'No se han encontrado pedidos',
|
||||
|
||||
// orders/confirmed
|
||||
ordersMadeAt: 'Pedidos realizados en',
|
||||
packages: '{n} bultos',
|
||||
|
||||
// Conditions
|
||||
// order
|
||||
total: 'Total',
|
||||
confirm: 'Confirmar',
|
||||
delivery: 'Fecha de entrega',
|
||||
address: 'Dirección',
|
||||
agency: 'Agencia',
|
||||
warehouse: 'Almacén',
|
||||
configure: 'Configurar',
|
||||
|
||||
// order/checkout
|
||||
checkout: 'Finalizar pedido',
|
||||
orderSummary: 'Resumen del pedido',
|
||||
accountsSummary: 'Resumen de cuentas',
|
||||
previousBalance: 'Saldo anterior',
|
||||
orderTotal: 'Total pedido',
|
||||
vat: 'IVA',
|
||||
totalDebt: 'Total deuda',
|
||||
credit: 'Crédito',
|
||||
exceededCredit: 'Crédito excedido',
|
||||
payAmount: 'Cantidad a pagar',
|
||||
payMethod: 'Método de pago',
|
||||
useMyBalance: 'Usar mi saldo',
|
||||
youHaveFaborableBalance: 'No necesitas pagar nada, tienes un saldo favorable.',
|
||||
useMyCredit: 'Usar mi crédito',
|
||||
youHaveFaborableCredit: 'No necesitas pagar nada, tienes crédito favorable.',
|
||||
creditCard: 'Tarjeta de crédito',
|
||||
youWillRedirectToPayment: 'Al confirmar el pedido serás redirigido a la plataforma de pago.',
|
||||
bankTransfer: 'Transferencia bancaria',
|
||||
makeTransfer: 'Haz una transferecia a la siguiente cuenta y envía el justificante a tu comercial.',
|
||||
payLater: 'Pagar más tarde',
|
||||
doYouWantToConfirm: '¿Deseas confirmar el pedido?',
|
||||
orderConfirmedSuccessfully: 'Tu pedido ha sido realizado con éxito',
|
||||
youExceededCredit: 'Has excedido tu crédito, por favor realiza el pago para que podamos preparar tu pedido.',
|
||||
notes: 'Notas',
|
||||
|
||||
// conditions
|
||||
conditionsDesc: 'Te aseguramos que el pedido llegara a tu casa/tienda en menos de 24/48 horas (Dependiendo de en que zona te encuentres).',
|
||||
|
||||
// About
|
||||
// about
|
||||
aboutDesc: 'Verdnatura te ofrece todos los servicios que necesita tu floristería.',
|
||||
|
||||
// Connections
|
||||
// connections
|
||||
nConnections: '{0} connexiones',
|
||||
refreshRate: 'Frecuencia de actualización',
|
||||
lastAction: 'Última acción',
|
||||
|
@ -168,27 +210,27 @@ export default {
|
|||
nSeconds: '{0} segundos',
|
||||
dontRefresh: 'No refrescar',
|
||||
|
||||
// Visits
|
||||
// accessLog
|
||||
accessLog: 'Registro de accesos',
|
||||
|
||||
// visits
|
||||
visitsCount: '{0} visitas, {1} nuevas',
|
||||
|
||||
// New
|
||||
// new
|
||||
title: 'Título',
|
||||
image: 'Imagen',
|
||||
tag: 'Etiqueta',
|
||||
priority: 'Prioridad',
|
||||
text: 'Texto',
|
||||
|
||||
// Images
|
||||
// images
|
||||
collection: 'Colección',
|
||||
updateMatchingId: 'Actualizar ítems con id coincidente',
|
||||
uploadAutomatically: 'Subir automáticamente',
|
||||
imagesUploadSuccess: 'Imágenes subidas correctamente',
|
||||
imagesUploadFailed: 'Algunas imágenes no se ha podido subir',
|
||||
|
||||
// User
|
||||
accessLog: 'Registro de accesos',
|
||||
|
||||
// Config
|
||||
// user
|
||||
userName: 'Nombre de usuario',
|
||||
nickname: 'Nombre a mostrar',
|
||||
language: 'Idioma',
|
||||
|
@ -207,14 +249,14 @@ export default {
|
|||
passwordsDontMatch: 'Las contraseñas no coinciden',
|
||||
passwordChanged: '¡Contraseña modificada correctamente!',
|
||||
|
||||
// Addresses
|
||||
// addresses
|
||||
setAsDefault: 'Establecer como predeterminada',
|
||||
addressSetAsDefault: 'Dirección establecida como predeterminada',
|
||||
addressRemoved: 'Dirección eliminada',
|
||||
areYouSureDeleteAddress: '¿Seguro que quieres eliminar la dirección?',
|
||||
addressCreated: '¡Dirección creada correctamente!',
|
||||
|
||||
// Address
|
||||
// address
|
||||
consignatary: 'Consignatario',
|
||||
street: 'Dirección',
|
||||
city: 'City',
|
||||
|
@ -224,7 +266,7 @@ export default {
|
|||
phone: 'Teléfono',
|
||||
mobile: 'Móvil',
|
||||
|
||||
// Register
|
||||
// register
|
||||
registerAsNew: 'Registrarse como nuevo usuario',
|
||||
notYetUser: '¿Todavía no eres usuari@?, registrate y empieza a disfrutar de todo lo que Verdnatura puede ofrecerte.',
|
||||
receiveOffers: 'Recibir ofertas y promociones por correo electrónico',
|
||||
|
|
|
@ -8,9 +8,6 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'About'
|
||||
|
|
|
@ -199,6 +199,7 @@
|
|||
<q-btn
|
||||
icon="add_shopping_cart"
|
||||
:title="$t('buy')"
|
||||
@click="showItem(item)"
|
||||
flat>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
@ -210,14 +211,51 @@
|
|||
</div>
|
||||
</template>
|
||||
</q-infinite-scroll>
|
||||
<q-dialog v-model="showItemDialog">
|
||||
<q-card style="width: 25em;">
|
||||
<q-img
|
||||
:src="`${$imageBase}/catalog/200x200/${item.image}`"
|
||||
:ratio="5/3">
|
||||
<div class="absolute-bottom text-center q-pa-xs">
|
||||
<div class="text-subtitle1">
|
||||
{{item.longName}}
|
||||
</div>
|
||||
</div>
|
||||
</q-img>
|
||||
<q-card-section>
|
||||
<div class="text-uppercase text-subtitle1 text-grey-7 ellipsize">
|
||||
{{item.subName}}
|
||||
</div>
|
||||
<div class="text-grey-7">
|
||||
#{{item.id}}
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div v-for="tag in item.tags" :key="tag.tagFk">
|
||||
<span class="text-grey-7">{{tag.tag.name}}</span> {{tag.value}}
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
@click="showItemDialog = false"
|
||||
flat>
|
||||
{{$t('cancel')}}
|
||||
</q-btn>
|
||||
<q-btn
|
||||
@click="showItemDialog = false"
|
||||
flat>
|
||||
{{$t('accept')}}
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-page-sticky position="bottom-right" :offset="[18, 18]">
|
||||
<q-btn
|
||||
fab
|
||||
icon="shopping_basket"
|
||||
color="accent"
|
||||
:to="{name: 'orders'}"
|
||||
:title="$t('orders')"
|
||||
/>
|
||||
:title="$t('orders')"/>
|
||||
</q-page-sticky>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -279,6 +317,8 @@ export default {
|
|||
typeId: null,
|
||||
types: [],
|
||||
orgTypes: [],
|
||||
item: {},
|
||||
showItemDialog: false,
|
||||
tags: [],
|
||||
isLoading: false,
|
||||
items: null,
|
||||
|
@ -537,6 +577,19 @@ export default {
|
|||
type.name.toLowerCase().indexOf(needle) > -1)
|
||||
})
|
||||
}
|
||||
},
|
||||
showItem (item) {
|
||||
this.item = item
|
||||
this.showItemDialog = true
|
||||
|
||||
let conf = this.$state.catalogConfig
|
||||
let params = {
|
||||
dated: this.date,
|
||||
addressFk: conf.addressFk,
|
||||
agencyModeFk: conf.agencyModeFk
|
||||
}
|
||||
this.$axios.get(`Items/${item.id}/calcCatalog`, { params })
|
||||
.then(res => (this.lots = res.data))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,14 +1,95 @@
|
|||
<template>
|
||||
<div class="text-subtitle1 text-center text-grey-7 q-pa-lg">
|
||||
Sorry this section is under construction
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
<q-drawer
|
||||
v-model="$state.rightDrawerOpen"
|
||||
side="right"
|
||||
elevated>
|
||||
<div
|
||||
v-if="order"
|
||||
class="q-pa-md">
|
||||
<q-input
|
||||
:label="$t('id')"
|
||||
:value="order.id"
|
||||
readonly/>
|
||||
<q-input
|
||||
:label="$t('delivery')"
|
||||
:value="order.landed | relDate"
|
||||
readonly/>
|
||||
<q-input
|
||||
v-if="order.address"
|
||||
:label="$t('address')"
|
||||
:value="order.address.nickname"
|
||||
readonly/>
|
||||
<q-input
|
||||
v-if="order.agencyMode"
|
||||
:label="$t('agency')"
|
||||
:value="order.agencyMode.name"
|
||||
readonly/>
|
||||
<q-input
|
||||
v-model="notes"
|
||||
:label="$t('notes')"
|
||||
type="textarea"/>
|
||||
<q-btn
|
||||
:label="$t('configure')"
|
||||
color="primary"
|
||||
class="q-mt-md"
|
||||
style="width: 100%;"
|
||||
flat/>
|
||||
</div>
|
||||
</q-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import Page from 'components/Page'
|
||||
|
||||
export default {
|
||||
name: 'Order'
|
||||
name: 'Order',
|
||||
mixins: [Page],
|
||||
data () {
|
||||
return {
|
||||
order: {},
|
||||
notes: null
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.$state.useRightDrawer = true
|
||||
},
|
||||
beforeRouteUpdate (to, from, next) {
|
||||
next()
|
||||
this.reload()
|
||||
},
|
||||
mounted () {
|
||||
this.reload()
|
||||
},
|
||||
methods: {
|
||||
reload () {
|
||||
let filter = {
|
||||
fields: [
|
||||
'id',
|
||||
'landed',
|
||||
'addressFk',
|
||||
'agencyModeFk'
|
||||
],
|
||||
include: [
|
||||
{
|
||||
relation: 'address',
|
||||
scope: {
|
||||
fields: ['nickname']
|
||||
}
|
||||
}, {
|
||||
relation: 'agencyMode',
|
||||
scope: {
|
||||
fields: ['name']
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
this.$axios.get(`Orders/${this.$route.params.id}`, { params: { filter } })
|
||||
.then(res => (this.order = res.data))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -0,0 +1,216 @@
|
|||
<template>
|
||||
<div class="vn-pp row justify-center">
|
||||
<q-card class="vn-w-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6">{{$t('accountsSummary')}}</div>
|
||||
<q-markup-table
|
||||
class="q-ma-sm"
|
||||
separator="vertical"
|
||||
bordered
|
||||
flat>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>{{$t('previousBalance')}}</td>
|
||||
<td class="text-right">{{data.debt | currency}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody
|
||||
class="border">
|
||||
<tr>
|
||||
<td>{{$t('orderTotal')}}</td>
|
||||
<td class="text-right">{{data.total | currency}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{$t('vat')}}</td>
|
||||
<td class="text-right">{{data.vat | currency}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody
|
||||
class="border">
|
||||
<tr class="text-bold">
|
||||
<td class="text-left">{{$t('totalDebt')}}</td>
|
||||
<td class="text-right">{{totalDebt | currency}}</td>
|
||||
</tr>
|
||||
<tr v-if="hasCredit">
|
||||
<td class="text-left">{{$t('credit')}}</td>
|
||||
<td class="text-right">{{data.credit | currency}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody
|
||||
class="border"
|
||||
v-if="isCreditExceeded">
|
||||
<tr class="text-red text-bold">
|
||||
<td class="text-left">{{$t('exceededCredit')}}</td>
|
||||
<td class="text-right">{{execeededCredit | currency}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</q-markup-table>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="text-h6">{{$t('payMethod')}}</div>
|
||||
<div v-if="!hasDebt">
|
||||
<q-radio
|
||||
v-model="payMethod"
|
||||
val="balance"
|
||||
:label="$t('useMyBalance')"/>
|
||||
<div
|
||||
v-if="payMethod == 'balance'"
|
||||
class="method-desc">
|
||||
{{$t('youHaveFaborableBalance')}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="canUseCredit">
|
||||
<q-radio
|
||||
v-model="payMethod"
|
||||
val="credit"
|
||||
:label="$t('useMyCredit')"/>
|
||||
<div
|
||||
v-if="payMethod == 'credit'"
|
||||
class="method-desc">
|
||||
{{$t('youHaveFaborableCredit')}}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<q-radio
|
||||
v-model="payMethod"
|
||||
val="card"
|
||||
:label="$t('creditCard')"/>
|
||||
<div
|
||||
v-if="payMethod == 'card'"
|
||||
class="method-desc">
|
||||
{{$t('youWillRedirectToPayment')}}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<q-radio
|
||||
v-model="payMethod"
|
||||
val="transfer"
|
||||
:label="$t('bankTransfer')"/>
|
||||
<div
|
||||
v-if="payMethod == 'transfer'"
|
||||
class="method-desc">
|
||||
<div>
|
||||
{{$t('makeTransfer')}}
|
||||
</div>
|
||||
<div class="q-mt-sm">
|
||||
{{bankName}}
|
||||
</div>
|
||||
<div>
|
||||
{{bankAccount}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<q-radio
|
||||
v-model="payMethod"
|
||||
val="later"
|
||||
:label="$t('payLater')"/>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section v-if="payMethod == 'card' && isCreditExceeded">
|
||||
<div class="text-h6">{{$t('payAmount')}}</div>
|
||||
<div>
|
||||
<q-radio
|
||||
v-model="payAmount"
|
||||
val="exceeded"
|
||||
:label="$t('exceededCredit') + ', '">
|
||||
{{execeededCredit | currency}}
|
||||
</q-radio>
|
||||
</div>
|
||||
<div>
|
||||
<q-radio
|
||||
v-model="payAmount"
|
||||
val="total"
|
||||
:label="$t('totalDebt') + ', '">
|
||||
{{totalDebt | currency}}
|
||||
</q-radio>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
<q-page-sticky position="bottom-right" :offset="[18, 18]">
|
||||
<q-btn
|
||||
fab
|
||||
icon="send"
|
||||
color="accent"
|
||||
@click="onConfirm"
|
||||
:title="$t('confirm')"/>
|
||||
</q-page-sticky>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.border
|
||||
border-top $layout-border
|
||||
.method-desc
|
||||
margin-left 3.2em
|
||||
color: $grey-8
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import Page from 'components/Page'
|
||||
|
||||
export default {
|
||||
name: 'OrderCheckout',
|
||||
mixins: [Page],
|
||||
data () {
|
||||
return {
|
||||
data: {
|
||||
debt: -27.52,
|
||||
total: 163.13,
|
||||
vat: 16.31,
|
||||
credit: 50
|
||||
},
|
||||
payAmount: null,
|
||||
payMethod: null,
|
||||
bankName: 'BANKINTER SA',
|
||||
bankAccount: 'ES81 0128 7635 0205 0000 2291'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
totalDebt () {
|
||||
let data = this.data
|
||||
return data.debt + data.total + data.vat
|
||||
},
|
||||
execeededCredit () {
|
||||
return this.totalDebt - this.data.credit
|
||||
},
|
||||
hasCredit () {
|
||||
return this.data.credit > 0
|
||||
},
|
||||
isCreditExceeded () {
|
||||
return this.hasCredit && this.execeededCredit > 0
|
||||
},
|
||||
canUseCredit () {
|
||||
return this.hasCredit && !this.isCreditExceeded
|
||||
},
|
||||
hasDebt () {
|
||||
return this.totalDebt > 0
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.payAmount = this.isCreditExceeded ? 'exceeded' : 'total'
|
||||
|
||||
if (!this.hasDebt) {
|
||||
this.payMethod = 'balance'
|
||||
} else if (this.canUseCredit) {
|
||||
this.payMethod = 'credit'
|
||||
} else {
|
||||
this.payMethod = 'card'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onConfirm () {
|
||||
this.$q.dialog({
|
||||
message: this.$t('doYouWantToConfirm'),
|
||||
cancel: true
|
||||
}).onOk(() => {
|
||||
this.$q.dialog({
|
||||
message: this.$t('orderConfirmedSuccessfully')
|
||||
})
|
||||
// this.$axios.delete(`Orders/${this.$route.params.id}/confirm`)
|
||||
// .then(() => {})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -0,0 +1,146 @@
|
|||
<template>
|
||||
<div class="vn-pp row justify-center">
|
||||
<toolbar>
|
||||
<div class="row">
|
||||
<q-badge
|
||||
v-if="total != null"
|
||||
class="text-subtitle1 q-mr-sm"
|
||||
color="secondary">
|
||||
{{$t('total')}} {{total | currency}}
|
||||
</q-badge>
|
||||
</div>
|
||||
</toolbar>
|
||||
<lb-scroll
|
||||
ref="scroll"
|
||||
:request="request"
|
||||
@data="data = arguments[0]">
|
||||
<q-card class="vn-w-md">
|
||||
<q-list bordered separator>
|
||||
<q-item
|
||||
v-for="row in data"
|
||||
:key="row.id">
|
||||
<q-item-section avatar>
|
||||
<q-avatar
|
||||
style="cursor: pointer;"
|
||||
@click.native="onImgClick(row.item.image)">
|
||||
<img :src="`${$imageBase}/catalog/200x200/${row.item.image}`">
|
||||
</q-avatar>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label class="ellipsis">
|
||||
{{row.item.longName}}
|
||||
</q-item-label>
|
||||
<q-item-label class="ellipsis" caption>
|
||||
<span
|
||||
v-for="tag in row.item.tags.slice(1, 3)"
|
||||
:key="tag.tagFk">
|
||||
{{tag.value}}
|
||||
</span>
|
||||
</q-item-label>
|
||||
<q-item-label class="ellipsis">
|
||||
{{row.quantity}} x {{row.price | currency}}
|
||||
<span style="float: right;">
|
||||
{{row.quantity * row.price | currency}}
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side top>
|
||||
<q-btn
|
||||
icon="delete"
|
||||
@click="onRemove(row)"
|
||||
:title="$t('delete')"
|
||||
size="12px"
|
||||
flat
|
||||
dense
|
||||
round/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
</lb-scroll>
|
||||
<full-image
|
||||
ref="fullImage"
|
||||
v-model="image"
|
||||
collection="catalog"/>
|
||||
<q-page-sticky position="bottom-right" :offset="[18, 18]">
|
||||
<q-btn
|
||||
fab
|
||||
icon="check"
|
||||
color="accent"
|
||||
to="checkout"
|
||||
:title="$t('confirm')"/>
|
||||
</q-page-sticky>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Page from 'components/Page'
|
||||
|
||||
export default {
|
||||
name: 'OrderView',
|
||||
mixins: [Page],
|
||||
data () {
|
||||
return {
|
||||
image: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
total () {
|
||||
let rows = this.data
|
||||
if (!rows) return null
|
||||
return rows.reduce((a, i) => a + i.quantity * i.price, 0)
|
||||
}
|
||||
},
|
||||
beforeRouteUpdate (to, from, next) {
|
||||
next()
|
||||
this.$refs.scroll.reload()
|
||||
},
|
||||
methods: {
|
||||
request () {
|
||||
return {
|
||||
url: `Orders/${this.$route.params.id}/rows`,
|
||||
filter: {
|
||||
fields: [
|
||||
'id',
|
||||
'quantity',
|
||||
'price',
|
||||
'itemFk'
|
||||
],
|
||||
order: 'created DESC',
|
||||
include: {
|
||||
relation: 'item',
|
||||
scope: {
|
||||
fields: ['longName', 'image'],
|
||||
include: {
|
||||
relation: 'tags',
|
||||
scope: {
|
||||
fields: ['tagFk', 'value'],
|
||||
order: 'priority'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onRemove (row) {
|
||||
this.$q.dialog({
|
||||
message: this.$t('areYouSureDelete'),
|
||||
cancel: true
|
||||
}).onOk(() => {
|
||||
this.$axios.delete(`Orders/${this.$route.params.id}/rows/${row.id}`)
|
||||
.then(res => {
|
||||
let rows = this.data
|
||||
let index = rows.indexOf(row)
|
||||
if (index !== -1) rows.splice(index, 1)
|
||||
this.$q.notify(this.$t('removedSuccess'))
|
||||
})
|
||||
})
|
||||
},
|
||||
onImgClick (image) {
|
||||
this.image = image
|
||||
this.$refs.fullImage.show()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -12,7 +12,7 @@
|
|||
<q-item
|
||||
v-for="order in orders"
|
||||
:key="order.id"
|
||||
:to="`/order/${order.id}`"
|
||||
:to="`/order/${order.id}/view`"
|
||||
clickable
|
||||
v-ripple>
|
||||
<q-item-section>
|
||||
|
@ -22,7 +22,7 @@
|
|||
<q-item-label caption>{{order.address.city}}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side top>
|
||||
485.50€
|
||||
{{order.taxableBase | currency}}
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
@ -33,8 +33,7 @@
|
|||
icon="add_shopping_cart"
|
||||
color="accent"
|
||||
:to="{name: 'catalog'}"
|
||||
:title="$t('startOrder')"
|
||||
/>
|
||||
:title="$t('startOrder')"/>
|
||||
</q-page-sticky>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -48,7 +47,7 @@ export default {
|
|||
}
|
||||
},
|
||||
mounted () {
|
||||
let params = { filter: {
|
||||
let filter = {
|
||||
where: {
|
||||
clientFk: this.$state.userId,
|
||||
isConfirmed: false
|
||||
|
@ -56,8 +55,8 @@ export default {
|
|||
include: 'address',
|
||||
order: 'created DESC',
|
||||
limit: 20
|
||||
} }
|
||||
this.$axios.get('Orders', { params })
|
||||
}
|
||||
this.$axios.get('Orders', { params: { filter } })
|
||||
.then(res => (this.orders = res.data))
|
||||
}
|
||||
}
|
||||
|
|
|
@ -33,11 +33,22 @@ const routes = [
|
|||
]
|
||||
}, {
|
||||
name: 'order',
|
||||
path: '/order/:order',
|
||||
component: () => import('pages/Order.vue')
|
||||
path: '/order/:id',
|
||||
component: () => import('pages/Order.vue'),
|
||||
children: [
|
||||
{
|
||||
name: 'view',
|
||||
path: 'view',
|
||||
component: () => import('pages/OrderView.vue')
|
||||
}, {
|
||||
name: 'checkout',
|
||||
path: 'checkout',
|
||||
component: () => import('pages/OrderCheckout.vue')
|
||||
}
|
||||
]
|
||||
}, {
|
||||
name: 'ticket',
|
||||
path: '/ticket/:ticket',
|
||||
path: '/ticket/:id',
|
||||
component: () => import('pages/Ticket.vue')
|
||||
}, {
|
||||
name: 'conditions',
|
||||
|
|
Loading…
Reference in New Issue