forked from verdnatura/hedera-web
WIP
This commit is contained in:
parent
33ef1da2a9
commit
57880705d0
|
@ -1,123 +1,130 @@
|
|||
|
||||
var Result = require('./result');
|
||||
const Result = require('./result');
|
||||
|
||||
/**
|
||||
* This class stores the database results.
|
||||
*/
|
||||
module.exports = new Class({
|
||||
results: null
|
||||
,error: null
|
||||
results: null,
|
||||
error: null,
|
||||
|
||||
/**
|
||||
* Initilizes the resultset object.
|
||||
*/
|
||||
,initialize(results, error) {
|
||||
initialize(results, error) {
|
||||
this.results = results;
|
||||
this.error = error;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Gets the query error.
|
||||
*
|
||||
* @return {Db.Err} the error or null if no errors hapened
|
||||
*/
|
||||
,getError() {
|
||||
getError() {
|
||||
return this.error;
|
||||
}
|
||||
},
|
||||
|
||||
,fetch() {
|
||||
if (this.error)
|
||||
fetch() {
|
||||
if (this.error) {
|
||||
throw this.error;
|
||||
|
||||
if (this.results !== null
|
||||
&& this.results.length > 0)
|
||||
}
|
||||
console.log('this.results', this.results);
|
||||
if (this.results !== null && this.results.length > 0) {
|
||||
return this.results.shift();
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Fetchs the next result from the resultset.
|
||||
*
|
||||
* @return {Db.Result} the result or %null if error or there are no more results
|
||||
*/
|
||||
,fetchResult() {
|
||||
var result = this.fetch();
|
||||
|
||||
fetchResult() {
|
||||
const result = this.fetch();
|
||||
console.log('test result', result);
|
||||
if (result !== null) {
|
||||
if (result.data instanceof Array)
|
||||
if (result.data instanceof Array) {
|
||||
return new Result(result);
|
||||
else
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Fetchs the first row object from the next resultset.
|
||||
*
|
||||
* @return {Array} the row if success, %null otherwise
|
||||
*/
|
||||
,fetchObject() {
|
||||
var result = this.fetch();
|
||||
fetchObject() {
|
||||
const result = this.fetch();
|
||||
|
||||
if (result !== null
|
||||
&& result.data instanceof Array
|
||||
&& result.data.length > 0)
|
||||
if (
|
||||
result !== null &&
|
||||
result.data instanceof Array &&
|
||||
result.data.length > 0
|
||||
) {
|
||||
return result.data[0];
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Fetchs data from the next resultset.
|
||||
*
|
||||
* @return {Array} the data
|
||||
*/
|
||||
,fetchData() {
|
||||
var result = this.fetch();
|
||||
fetchData() {
|
||||
const result = this.fetch();
|
||||
|
||||
if (result !== null
|
||||
&& result.data instanceof Array)
|
||||
if (result !== null && result.data instanceof Array) {
|
||||
return result.data;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Fetchs the first row and column value from the next resultset.
|
||||
*
|
||||
* @return {Object} the value if success, %null otherwise
|
||||
*/
|
||||
,fetchValue() {
|
||||
var row = this.fetchRow();
|
||||
fetchValue() {
|
||||
const row = this.fetchRow();
|
||||
|
||||
if (row instanceof Array && row.length > 0)
|
||||
if (row instanceof Array && row.length > 0) {
|
||||
return row[0];
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Fetchs the first row from the next resultset.
|
||||
*
|
||||
* @return {Array} the row if success, %null otherwise
|
||||
*/
|
||||
,fetchRow() {
|
||||
var result = this.fetch();
|
||||
fetchRow() {
|
||||
const result = this.fetch();
|
||||
|
||||
if (result !== null
|
||||
&& result.data instanceof Array
|
||||
&& result.data.length > 0) {
|
||||
var object = result.data[0];
|
||||
var row = new Array(result.columns.length);
|
||||
for(var i = 0; i < row.length; i++)
|
||||
if (
|
||||
result !== null &&
|
||||
result.data instanceof Array &&
|
||||
result.data.length > 0
|
||||
) {
|
||||
const object = result.data[0];
|
||||
const row = new Array(result.columns.length);
|
||||
for (let i = 0; i < row.length; i++) {
|
||||
row[i] = object[result.columns[i].name];
|
||||
}
|
||||
return row;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -26,6 +26,9 @@ a.link {
|
|||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
.default-radius {
|
||||
border-radius: 0.6em;
|
||||
}
|
||||
.q-card {
|
||||
border-radius: 0.6em !important;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
|
||||
|
|
|
@ -63,5 +63,6 @@ export default {
|
|||
orderLoadedIntoBasket: 'Comanda carregada a la cistella!',
|
||||
at: 'a les',
|
||||
back: 'Tornar',
|
||||
remove: 'Esborrar'
|
||||
remove: 'Esborrar',
|
||||
agency: 'Agència'
|
||||
};
|
||||
|
|
|
@ -77,6 +77,7 @@ export default {
|
|||
at: 'at',
|
||||
back: 'Back',
|
||||
remove: 'Remove',
|
||||
agency: 'Agency',
|
||||
|
||||
orders: 'Orders',
|
||||
order: 'Pending order',
|
||||
|
|
|
@ -83,6 +83,7 @@ export default {
|
|||
at: 'a las',
|
||||
back: 'Volver',
|
||||
remove: 'Borrar',
|
||||
agency: 'Agencia',
|
||||
|
||||
orders: 'Pedidos',
|
||||
order: 'Pedido pendiente',
|
||||
|
|
|
@ -63,5 +63,6 @@ export default {
|
|||
orderLoadedIntoBasket: 'Commande chargée dans le panier!',
|
||||
at: 'à',
|
||||
back: 'Retour',
|
||||
remove: 'Effacer'
|
||||
remove: 'Effacer',
|
||||
agency: 'Agence'
|
||||
};
|
||||
|
|
|
@ -64,5 +64,6 @@ export default {
|
|||
orderLoadedIntoBasket: 'Pedido carregado na cesta!',
|
||||
at: 'às',
|
||||
back: 'Voltar',
|
||||
remove: 'Eliminar'
|
||||
remove: 'Eliminar',
|
||||
agency: 'Agência'
|
||||
};
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { JsonConnection } from '../vn/json-connection'
|
||||
import { ResultSet } from './result-set'
|
||||
import { JsonConnection } from '../vn/json-connection';
|
||||
import { ResultSet } from './result-set';
|
||||
|
||||
/**
|
||||
* Simulates a connection to a database by making asynchronous requests to a
|
||||
|
@ -15,7 +15,7 @@ const Flag = {
|
|||
NOT_NULL: 1,
|
||||
PRI_KEY: 2,
|
||||
AI: 512 | 2 | 1
|
||||
}
|
||||
};
|
||||
|
||||
const Type = {
|
||||
BOOLEAN: 1,
|
||||
|
@ -24,11 +24,11 @@ const Type = {
|
|||
STRING: 5,
|
||||
DATE: 8,
|
||||
DATE_TIME: 9
|
||||
}
|
||||
};
|
||||
|
||||
export class Connection extends JsonConnection {
|
||||
static Flag = Flag
|
||||
static Type = Type
|
||||
static Flag = Flag;
|
||||
static Type = Type;
|
||||
|
||||
/**
|
||||
* Runs a SQL query on the database.
|
||||
|
@ -37,67 +37,69 @@ export class Connection extends JsonConnection {
|
|||
* @return {ResultSet} The result
|
||||
*/
|
||||
async execSql(sql) {
|
||||
const json = await this.send('core/query', { sql })
|
||||
const results = []
|
||||
let err
|
||||
const json = await this.send('core/query', { sql });
|
||||
const results = [];
|
||||
let err;
|
||||
|
||||
if (json) {
|
||||
try {
|
||||
if (json && json instanceof Array) {
|
||||
for (let i = 0; i < json.length; i++) {
|
||||
if (json[i] !== true) {
|
||||
const rows = json[i].data
|
||||
const columns = json[i].columns
|
||||
const rows = json[i].data;
|
||||
const columns = json[i].columns;
|
||||
|
||||
const data = new Array(rows.length)
|
||||
const data = new Array(rows.length);
|
||||
results.push({
|
||||
data,
|
||||
columns,
|
||||
tables: json[i].tables
|
||||
})
|
||||
});
|
||||
|
||||
for (let j = 0; j < rows.length; j++) {
|
||||
const row = (data[j] = {})
|
||||
const row = (data[j] = {});
|
||||
for (let k = 0; k < columns.length; k++) {
|
||||
row[columns[k].name] = rows[j][k]
|
||||
row[columns[k].name] = rows[j][k];
|
||||
}
|
||||
}
|
||||
|
||||
for (let j = 0; j < columns.length; j++) {
|
||||
let castFunc = null
|
||||
const col = columns[j]
|
||||
let castFunc = null;
|
||||
const col = columns[j];
|
||||
|
||||
switch (col.type) {
|
||||
case Type.DATE:
|
||||
case Type.DATE_TIME:
|
||||
case Type.TIMESTAMP:
|
||||
castFunc = this.valueToDate
|
||||
break
|
||||
castFunc = this.valueToDate;
|
||||
break;
|
||||
}
|
||||
|
||||
if (castFunc !== null) {
|
||||
if (col.def != null) {
|
||||
col.def = castFunc(col.def)
|
||||
col.def = castFunc(col.def);
|
||||
}
|
||||
|
||||
for (let k = 0; k < data.length; k++) {
|
||||
if (data[k][col.name] != null) {
|
||||
data[k][col.name] = castFunc(data[k][col.name])
|
||||
data[k][col.name] = castFunc(
|
||||
data[k][col.name]
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
results.push(json[i])
|
||||
results.push(json[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
err = e
|
||||
err = e;
|
||||
}
|
||||
}
|
||||
|
||||
return new ResultSet(results, err)
|
||||
return new ResultSet(results, err);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -108,47 +110,48 @@ export class Connection extends JsonConnection {
|
|||
* @return {ResultSet} The result
|
||||
*/
|
||||
async execQuery(query, params) {
|
||||
const sql = query.replace(/#\w+/g, (key) => {
|
||||
const value = params[key.substring(1)]
|
||||
return value ? this.renderValue(value) : key
|
||||
})
|
||||
const sql = query.replace(/#\w+/g, key => {
|
||||
const value = params[key.substring(1)];
|
||||
return value ? this.renderValue(value) : key;
|
||||
});
|
||||
|
||||
return await this.execSql(sql)
|
||||
return await this.execSql(sql);
|
||||
}
|
||||
|
||||
async query(query, params) {
|
||||
const res = await this.execQuery(query, params)
|
||||
return res.fetchData()
|
||||
const res = await this.execQuery(query, params);
|
||||
return res.fetchData();
|
||||
}
|
||||
|
||||
async getObject(query, params) {
|
||||
const res = await this.execQuery(query, params)
|
||||
return res.fetchObject()
|
||||
const res = await this.execQuery(query, params);
|
||||
return res.fetchObject();
|
||||
}
|
||||
|
||||
async getValue(query, params) {
|
||||
const res = await this.execQuery(query, params)
|
||||
return res.fetchValue()
|
||||
const res = await this.execQuery(query, params);
|
||||
console.log('RESSSS: ', res);
|
||||
return res.fetchValue();
|
||||
}
|
||||
|
||||
renderValue(v) {
|
||||
switch (typeof v) {
|
||||
case 'number':
|
||||
return v
|
||||
return v;
|
||||
case 'boolean':
|
||||
return v ? 'TRUE' : 'FALSE'
|
||||
return v ? 'TRUE' : 'FALSE';
|
||||
case 'string':
|
||||
return "'" + v.replace(this.regexp, this.replaceFunc) + "'"
|
||||
return "'" + v.replace(this.regexp, this.replaceFunc) + "'";
|
||||
default:
|
||||
if (v instanceof Date) {
|
||||
if (!isNaN(v.getTime())) {
|
||||
const unixTime = parseInt(fixTz(v).getTime() / 1000)
|
||||
return 'DATE(FROM_UNIXTIME(' + unixTime + '))'
|
||||
const unixTime = parseInt(fixTz(v).getTime() / 1000);
|
||||
return 'DATE(FROM_UNIXTIME(' + unixTime + '))';
|
||||
} else {
|
||||
return '0000-00-00'
|
||||
return '0000-00-00';
|
||||
}
|
||||
} else {
|
||||
return 'NULL'
|
||||
return 'NULL';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -157,28 +160,29 @@ export class Connection extends JsonConnection {
|
|||
* Parses a value to date.
|
||||
*/
|
||||
valueToDate(value) {
|
||||
return fixTz(new Date(value))
|
||||
return fixTz(new Date(value));
|
||||
}
|
||||
}
|
||||
|
||||
// TODO: Read time zone from db configuration
|
||||
const tz = { timeZone: 'Europe/Madrid' }
|
||||
const isLocal = Intl.DateTimeFormat().resolvedOptions().timeZone === tz.timeZone
|
||||
const tz = { timeZone: 'Europe/Madrid' };
|
||||
const isLocal =
|
||||
Intl.DateTimeFormat().resolvedOptions().timeZone === tz.timeZone;
|
||||
|
||||
function fixTz(date) {
|
||||
if (isLocal) return date
|
||||
if (isLocal) return date;
|
||||
|
||||
const localDate = new Date(date.toLocaleString('en-US', tz))
|
||||
const localDate = new Date(date.toLocaleString('en-US', tz));
|
||||
const hasTime =
|
||||
localDate.getHours() ||
|
||||
localDate.getMinutes() ||
|
||||
localDate.getSeconds() ||
|
||||
localDate.getMilliseconds()
|
||||
localDate.getMilliseconds();
|
||||
|
||||
if (!hasTime) {
|
||||
date.setHours(date.getHours() + 12)
|
||||
date.setHours(0, 0, 0, 0)
|
||||
date.setHours(date.getHours() + 12);
|
||||
date.setHours(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
return date
|
||||
return date;
|
||||
}
|
||||
|
|
|
@ -1,18 +1,18 @@
|
|||
import { Result } from './result'
|
||||
import { Result } from './result';
|
||||
|
||||
/**
|
||||
* This class stores the database results.
|
||||
*/
|
||||
export class ResultSet {
|
||||
results = null
|
||||
error = null
|
||||
results = null;
|
||||
error = null;
|
||||
|
||||
/**
|
||||
* Initilizes the resultset object.
|
||||
*/
|
||||
constructor(results, error) {
|
||||
this.results = results
|
||||
this.error = error
|
||||
this.results = results;
|
||||
this.error = error;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -21,19 +21,19 @@ export class ResultSet {
|
|||
* @return {Db.Err} the error or null if no errors hapened
|
||||
*/
|
||||
getError() {
|
||||
return this.error
|
||||
return this.error;
|
||||
}
|
||||
|
||||
fetch() {
|
||||
if (this.error) {
|
||||
throw this.error
|
||||
throw this.error;
|
||||
}
|
||||
|
||||
if (this.results !== null && this.results.length > 0) {
|
||||
return this.results.shift()
|
||||
return this.results.shift();
|
||||
}
|
||||
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -42,17 +42,17 @@ export class ResultSet {
|
|||
* @return {Db.Result} the result or %null if error or there are no more results
|
||||
*/
|
||||
fetchResult() {
|
||||
const result = this.fetch()
|
||||
const result = this.fetch();
|
||||
|
||||
if (result !== null) {
|
||||
if (result.data instanceof Array) {
|
||||
return new Result(result)
|
||||
return new Result(result);
|
||||
} else {
|
||||
return true
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -61,17 +61,17 @@ export class ResultSet {
|
|||
* @return {Array} the row if success, %null otherwise
|
||||
*/
|
||||
fetchObject() {
|
||||
const result = this.fetch()
|
||||
const result = this.fetch();
|
||||
|
||||
if (
|
||||
result !== null &&
|
||||
result.data instanceof Array &&
|
||||
result.data.length > 0
|
||||
) {
|
||||
return result.data[0]
|
||||
return result.data[0];
|
||||
}
|
||||
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -80,13 +80,13 @@ export class ResultSet {
|
|||
* @return {Array} the data
|
||||
*/
|
||||
fetchData() {
|
||||
const result = this.fetch()
|
||||
const result = this.fetch();
|
||||
|
||||
if (result !== null && result.data instanceof Array) {
|
||||
return result.data
|
||||
return result.data;
|
||||
}
|
||||
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -95,13 +95,13 @@ export class ResultSet {
|
|||
* @return {Object} the value if success, %null otherwise
|
||||
*/
|
||||
fetchValue() {
|
||||
const row = this.fetchRow()
|
||||
|
||||
const row = this.fetchRow();
|
||||
console.log('row', row);
|
||||
if (row instanceof Array && row.length > 0) {
|
||||
return row[0]
|
||||
return row[0];
|
||||
}
|
||||
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -110,21 +110,21 @@ export class ResultSet {
|
|||
* @return {Array} the row if success, %null otherwise
|
||||
*/
|
||||
fetchRow() {
|
||||
const result = this.fetch()
|
||||
|
||||
const result = this.fetch();
|
||||
console.log('test result', result);
|
||||
if (
|
||||
result !== null &&
|
||||
result.data instanceof Array &&
|
||||
result.data.length > 0
|
||||
) {
|
||||
const object = result.data[0]
|
||||
const row = new Array(result.columns.length)
|
||||
const object = result.data[0];
|
||||
const row = new Array(result.columns.length);
|
||||
for (let i = 0; i < row.length; i++) {
|
||||
row[i] = object[result.columns[i].name]
|
||||
row[i] = object[result.columns[i].name];
|
||||
}
|
||||
return row
|
||||
return row;
|
||||
}
|
||||
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@ export function currency(val) {
|
|||
return typeof val === 'number' ? val.toFixed(2) + '€' : val;
|
||||
}
|
||||
|
||||
export function date(val, format) {
|
||||
export function date(val, format = 'YYYY-MM-DD') {
|
||||
if (val == null) return val;
|
||||
if (!(val instanceof Date)) {
|
||||
val = new Date(val);
|
||||
|
|
|
@ -127,13 +127,6 @@ onMounted(async () => {
|
|||
v-model="data.text"
|
||||
:toolbar="[
|
||||
[
|
||||
{
|
||||
label: $q.lang.editor.align,
|
||||
icon: $q.iconSet.editor.align,
|
||||
fixedLabel: true,
|
||||
list: 'only-icons',
|
||||
options: ['left', 'center', 'right', 'justify']
|
||||
},
|
||||
{
|
||||
label: $q.lang.editor.align,
|
||||
icon: $q.iconSet.editor.align,
|
||||
|
|
|
@ -45,10 +45,10 @@ const supplantUser = async user => {
|
|||
<template>
|
||||
<Teleport v-if="isHeaderMounted" to="#actions">
|
||||
<VnSearchBar
|
||||
:sqlQuery="query"
|
||||
searchField="user"
|
||||
@onSearch="onSearch"
|
||||
@onSearchError="users = []"
|
||||
:sql-query="query"
|
||||
search-field="user"
|
||||
@on-search="onSearch"
|
||||
@on-search-error="users = []"
|
||||
/>
|
||||
</Teleport>
|
||||
<QPage class="vn-w-xs">
|
||||
|
@ -81,7 +81,10 @@ const supplantUser = async user => {
|
|||
flat
|
||||
rounded
|
||||
@click="supplantUser(user.name)"
|
||||
/>
|
||||
><QTooltip>
|
||||
{{ t('Impersonate user') }}
|
||||
</QTooltip></QBtn
|
||||
>
|
||||
</template>
|
||||
</CardList>
|
||||
</QList>
|
||||
|
@ -91,12 +94,32 @@ const supplantUser = async user => {
|
|||
<i18n lang="yaml">
|
||||
en-US:
|
||||
noData: No data
|
||||
User management: User management
|
||||
Disabled: Disabled
|
||||
Impersonate user: Impersonate user
|
||||
Access log: Access log
|
||||
es-ES:
|
||||
noData: Sin datos
|
||||
User management: Gestión de usuarios
|
||||
Disabled: Desactivado
|
||||
Impersonate user: Suplantar usuario
|
||||
Access log: Registro de accesos
|
||||
ca-ES:
|
||||
noData: Sense dades
|
||||
User management: Gestió d'usuaris
|
||||
Disabled: Deshabilitat
|
||||
Impersonate user: Suplantar usuari
|
||||
Access log: Registre d'accessos
|
||||
fr-FR:
|
||||
noData: Aucune donnée
|
||||
User management: Gestion des utilisateurs
|
||||
Disabled: Désactivé
|
||||
Impersonate user: Accès utilisateur
|
||||
Access log: Journal des accès
|
||||
pt-PT:
|
||||
noData: Sem dados
|
||||
User management: Gestão de usuarios
|
||||
Disabled: Desativado
|
||||
Impersonate user: Suplantar usuario
|
||||
Access log: Registro de acessos
|
||||
</i18n>
|
||||
|
|
|
@ -2,11 +2,10 @@
|
|||
import { ref, inject, watch, computed } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { date as qdate } from 'quasar';
|
||||
|
||||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||
|
||||
import { formatDateTitle } from 'src/lib/filters.js';
|
||||
import { formatDateTitle, date } from 'src/lib/filters.js';
|
||||
import { useAppStore } from 'stores/app';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
|
@ -39,8 +38,8 @@ const getVisits = async () => {
|
|||
WHERE c.stamp BETWEEN TIMESTAMP(#from,'00:00:00') AND TIMESTAMP(#to,'23:59:59')
|
||||
GROUP BY browser ORDER BY visits DESC`,
|
||||
{
|
||||
from: qdate.formatDate(from.value, 'YYYY-MM-DD'),
|
||||
to: qdate.formatDate(to.value, 'YYYY-MM-DD')
|
||||
from: date(from.value),
|
||||
to: date(to.value)
|
||||
}
|
||||
);
|
||||
visitsData.value = visitsResponse;
|
||||
|
@ -60,8 +59,8 @@ watch(
|
|||
async () => {
|
||||
await router.replace({
|
||||
query: {
|
||||
from: qdate.formatDate(from.value, 'YYYY-MM-DD'),
|
||||
to: qdate.formatDate(to.value, 'YYYY-MM-DD')
|
||||
from: date(from.value),
|
||||
to: date(to.value)
|
||||
}
|
||||
});
|
||||
await getVisits();
|
||||
|
|
|
@ -66,27 +66,22 @@ onMounted(() => getPackages());
|
|||
|
||||
<i18n lang="yaml">
|
||||
en-US:
|
||||
agency: Agency
|
||||
bundles: Bundles
|
||||
expeditions: Exps.
|
||||
prevision: Prev.
|
||||
es-ES:
|
||||
agency: Agencia
|
||||
bundles: Bultos
|
||||
expeditions: Exps.
|
||||
prevision: Prev.
|
||||
ca-ES:
|
||||
agency: Agència
|
||||
bundles: Paquets
|
||||
expeditions: Exps.
|
||||
prevision: Prev.
|
||||
fr-FR:
|
||||
agency: Agence
|
||||
bundles: Cartons
|
||||
expeditions: Exps.
|
||||
prevision: Prev.
|
||||
pt-PT:
|
||||
agency: Agência
|
||||
bundles: Bultos
|
||||
expeditions: Exps.
|
||||
prevision: Prev.
|
||||
|
|
|
@ -1 +1,346 @@
|
|||
<template>Checkout</template>
|
||||
<script setup>
|
||||
import { ref, onMounted, inject, computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
|
||||
import { formatDateTitle } from 'src/lib/filters.js';
|
||||
import useNotify from 'src/composables/useNotify.js';
|
||||
import { useAppStore } from 'stores/app';
|
||||
|
||||
const jApi = inject('jApi');
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const { notify } = useNotify();
|
||||
const appStore = useAppStore();
|
||||
|
||||
const stepperRef = ref(null);
|
||||
|
||||
const steps = {
|
||||
AGENCY: [
|
||||
{ name: 'method' },
|
||||
{ name: 'date' },
|
||||
{ name: 'address' },
|
||||
{ name: 'agency' },
|
||||
{ name: 'confirm-delivery' }
|
||||
],
|
||||
PICKUP: []
|
||||
};
|
||||
const loading = ref(false);
|
||||
const today = ref(null);
|
||||
const addresses = ref([]);
|
||||
const agencies = ref([]);
|
||||
const currentStep = ref(1);
|
||||
const lastStep = 5;
|
||||
const id = route.params.id;
|
||||
const orderForm = ref({
|
||||
method: '',
|
||||
date: '',
|
||||
address: '',
|
||||
agency: ''
|
||||
});
|
||||
|
||||
const confirmArrivalText = computed(() => {
|
||||
if (!orderForm.value.agency) return '';
|
||||
return `${t('arrival')} ${formatDateTitle(orderForm.value.date)}`;
|
||||
});
|
||||
|
||||
const confirmAddressText = computed(() => {
|
||||
if (!orderForm.value.address) return '';
|
||||
const address = addresses.value.find(
|
||||
address => address.id === orderForm.value.address
|
||||
);
|
||||
return address.street;
|
||||
});
|
||||
|
||||
const confirmAgencyText = computed(() => {
|
||||
if (!orderForm.value.agency) return '';
|
||||
const agency = agencies.value.find(
|
||||
agency => agency.id === orderForm.value.agency
|
||||
);
|
||||
return `${t('agency')} ${agency.description}`;
|
||||
});
|
||||
|
||||
const getAddresses = async () => {
|
||||
try {
|
||||
addresses.value = await jApi.query(
|
||||
`SELECT a.id, a.nickname, p.name province, a.city, a.street, a.isActive, c.name
|
||||
FROM myAddress a
|
||||
LEFT JOIN vn.province p ON p.id = a.provinceFk
|
||||
JOIN vn.country c ON c.id = p.countryFk
|
||||
WHERE a.isActive`
|
||||
);
|
||||
console.log('addresses:', addresses.value);
|
||||
} catch (error) {
|
||||
console.error('Error getting addresses:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const getAgencies = async () => {
|
||||
try {
|
||||
const { results } = await jApi.execQuery(
|
||||
`CALL vn.zone_getAgency(#address, #date);
|
||||
SELECT DISTINCT a.agencyModeFk id, a.description
|
||||
FROM tmp.zoneGetAgency a
|
||||
JOIN vn.deliveryMethod d
|
||||
ON d.id = a.deliveryMethodFk
|
||||
WHERE d.code IN ('AGENCY', 'DELIVERY')
|
||||
AND a.isVisible
|
||||
ORDER BY a.description;
|
||||
DROP TEMPORARY TABLE tmp.zoneGetAgency`,
|
||||
{
|
||||
address: orderForm.value.address,
|
||||
date: orderForm.value.date
|
||||
}
|
||||
);
|
||||
agencies.value = results[1].data;
|
||||
console.log('agencies:', agencies.value);
|
||||
} catch (error) {
|
||||
console.error('Error getting agencies:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const onAddressSelected = id => {
|
||||
orderForm.value.address = id;
|
||||
stepperRef.value.next();
|
||||
};
|
||||
|
||||
const onStepChange = async step => {
|
||||
console.log('step:', step);
|
||||
if (step === 4) {
|
||||
await getAgencies();
|
||||
} else if (step === lastStep) {
|
||||
submit();
|
||||
}
|
||||
// console.log('event:', event);
|
||||
};
|
||||
|
||||
const submit = async () => {
|
||||
loading.value = true;
|
||||
// const id = route.params.id;
|
||||
let query =
|
||||
'CALL myOrder_create(@orderId, #date, #method, #agency, #address); SELECT @orderId;';
|
||||
if (id) {
|
||||
orderForm.value.id = id;
|
||||
query =
|
||||
'CALL myOrder_configure(#id, #date, #method, #agency, #address)';
|
||||
}
|
||||
|
||||
console.log('id:', id);
|
||||
let resultSet;
|
||||
try {
|
||||
resultSet = await jApi.execQuery(query, orderForm.value);
|
||||
console.log('resultSet:', resultSet);
|
||||
if (id) {
|
||||
notify(t('orderUpdated'), 'positive');
|
||||
|
||||
if (route.query.continue === 'catalog') {
|
||||
router.push({ name: 'catalog' });
|
||||
} else {
|
||||
router.push({ name: 'basket', params: { id } });
|
||||
}
|
||||
} else {
|
||||
console.log('pre resultSet log: ', resultSet);
|
||||
// const orderId = resultSet.fetchValue(); por alguna razon no funciona
|
||||
const orderId = resultSet.results[1].data[0]['@orderId'];
|
||||
console.log('orderId:', orderId);
|
||||
appStore.loadIntoBasket(orderId);
|
||||
router.push({ name: 'catalog' });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error submitting order:', error);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
|
||||
// const basket = new Hedera.Basket(this.app);
|
||||
|
||||
// if (id) {
|
||||
// Htk.Toast.showMessage(_('OrderUpdated'));
|
||||
|
||||
// switch (this.hash.$.continue) {
|
||||
// case 'catalog':
|
||||
// redirect = { form: 'ecomerce/catalog' };
|
||||
// break;
|
||||
// default:
|
||||
// redirect = { form: 'ecomerce/basket' };
|
||||
// if (id !== basket.orderId) redirect.id = id;
|
||||
// }
|
||||
// } else {
|
||||
// basket.loadIntoBasket(resultSet.fetchValue());
|
||||
// redirect = { form: 'ecomerce/catalog' };
|
||||
// }
|
||||
|
||||
// this.hash.setAll(redirect);
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
today.value = Date.vnNew();
|
||||
today.value.setHours(0, 0, 0, 0);
|
||||
// if (id) {
|
||||
// }
|
||||
getAddresses();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QPage class="vn-w-sm">
|
||||
<QStepper
|
||||
v-model="currentStep"
|
||||
ref="stepperRef"
|
||||
animated
|
||||
keep-alive
|
||||
class="default-radius"
|
||||
@update:model-value="onStepChange"
|
||||
>
|
||||
<QStep name="1" :done="currentStep > 1" done-color="accent">
|
||||
<div class="column justify-center items-center">
|
||||
<span class="text-h6 text-bold tex q-mb-md text-center">
|
||||
{{ t('receiveOrPickOrder') }}
|
||||
</span>
|
||||
<div class="column" style="max-width: max-content">
|
||||
<QRadio
|
||||
v-model="orderForm.method"
|
||||
val="AGENCY"
|
||||
:label="t('receiveOrder')"
|
||||
/>
|
||||
<QRadio
|
||||
v-model="orderForm.method"
|
||||
val="PICKUP"
|
||||
:label="t('pickupInStore')"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</QStep>
|
||||
<QStep :name="2" :done="currentStep > 2" done-color="accent">
|
||||
<div class="flex justify-center items-center">
|
||||
<span class="text-h6 text-bold tex q-mb-md text-center">
|
||||
{{ t('receiveOrPickOrder') }}
|
||||
</span>
|
||||
<QDate
|
||||
v-model="orderForm.date"
|
||||
class="margin-auto"
|
||||
color="accent"
|
||||
/>
|
||||
</div>
|
||||
</QStep>
|
||||
<QStep :name="3" :done="currentStep > 3" done-color="accent">
|
||||
<QList
|
||||
v-if="orderForm.method === 'AGENCY'"
|
||||
class="vn-w-xs q-gutter-y-sm"
|
||||
>
|
||||
<QItem
|
||||
v-for="(address, index) in addresses"
|
||||
:key="index"
|
||||
class="column"
|
||||
clickable
|
||||
v-ripple
|
||||
@click="onAddressSelected(address.id)"
|
||||
>
|
||||
<QItemLabel class="text-bold text-subtitle1">
|
||||
{{ address.nickname }}
|
||||
</QItemLabel>
|
||||
<QItemLabel class="text-subtitle1">
|
||||
{{ address.street }}
|
||||
</QItemLabel>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QStep>
|
||||
<QStep :name="4" :done="currentStep > 4" done-color="accent">
|
||||
<div class="flex justify-center items-center">
|
||||
<span class="text-h6 text-bold tex q-mb-md text-center">
|
||||
{{ t('orderDateDelivery') }}
|
||||
</span>
|
||||
<VnSelect
|
||||
v-model="orderForm.agency"
|
||||
option-label="description"
|
||||
option-value="id"
|
||||
:options="agencies"
|
||||
@update:model-value="stepperRef.next()"
|
||||
/>
|
||||
</div>
|
||||
</QStep>
|
||||
<QStep :name="5" :done="currentStep > 5" done-color="accent">
|
||||
<div class="flex column justify-center items-center">
|
||||
<span class="text-h6 text-bold tex q-mb-md text-center">
|
||||
{{ t('confirmData') }}
|
||||
</span>
|
||||
<div class="column vn-w-xs full-width">
|
||||
<span>{{ confirmArrivalText }}</span>
|
||||
<span>{{ confirmAddressText }}</span>
|
||||
<span>{{ confirmAgencyText }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</QStep>
|
||||
<template #navigation>
|
||||
<QStepperNavigation class="flex justify-between">
|
||||
<QBtn
|
||||
flat
|
||||
color="primary"
|
||||
@click="stepperRef.previous()"
|
||||
label="Back"
|
||||
class="q-ml-sm"
|
||||
:class="{ invisible: currentStep === 1 }"
|
||||
/>
|
||||
<QBtn
|
||||
@click="stepperRef.next()"
|
||||
color="primary"
|
||||
label="next"
|
||||
/>
|
||||
</QStepperNavigation>
|
||||
</template>
|
||||
</QStepper>
|
||||
<pre>{{ orderForm }}</pre>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
<i18n lang="yaml">
|
||||
en-US:
|
||||
receiveOrPickOrder: Do you want to receive or pickup the order?
|
||||
receiveOrder: Receive in my store
|
||||
pickupInStore: Store pickup
|
||||
orderDateDelivery: What day you want to receive the order?
|
||||
howDoYouWantToReceive: How do you want to receive the order?
|
||||
confirmData: Confirm data
|
||||
arrival: Arrival
|
||||
orderUpdated: Order updated
|
||||
es-ES:
|
||||
receiveOrPickOrder: ¿Quieres recibir o recoger el pedido?
|
||||
receiveOrder: Recibir en mi tienda
|
||||
pickupInStore: Recoger en almacén
|
||||
orderDateDelivery: ¿Qué día quieres recibir el pedido?
|
||||
howDoYouWantToReceive: ¿Cómo quieres recibir el pedido?
|
||||
confirmData: Confirma los datos
|
||||
arrival: Llegada
|
||||
orderUpdated: Pedido actualizado
|
||||
ca-ES:
|
||||
receiveOrPickOrder: Vols rebre o recollir la comanda?
|
||||
receiveOrder: Rebre en mi tenda
|
||||
pickupInStore: Recollir en magatzem
|
||||
orderDateDelivery: Quin dia vols rebre la comanda?
|
||||
howDoYouWantToReceive: Com vols rebre la comanda?
|
||||
confirmData: Confirma les dades
|
||||
arrival: Arribada
|
||||
orderUpdated: Comanda actualitzada
|
||||
fr-FR:
|
||||
receiveOrPickOrder: Voulez-vous recevoir ou récuperer l'ordre?
|
||||
receiveOrder: Livraison à la boutique
|
||||
pickupInStore: Récupérer en entrepôt
|
||||
orderDateDelivery: Date de livraison?
|
||||
howDoYouWantToReceive: Agence de livraison
|
||||
confirmData: Confirmez les coordonnées
|
||||
arrival: Arrivée
|
||||
orderUpdated: Mise à jour commande
|
||||
pt-PT:
|
||||
receiveOrPickOrder: Queres receber ou levantar a encomenda?
|
||||
receiveOrder: Receber na minha loja
|
||||
pickupInStore: Levantar no armazém
|
||||
orderDateDelivery: Como queres receber a encomenda?
|
||||
confirmData: Confirme os dados
|
||||
arrival: Chegada
|
||||
orderUpdated: Encomenda actualizada
|
||||
</i18n>
|
||||
|
|
|
@ -109,7 +109,6 @@ en-US:
|
|||
shippingInformation: Shipping Information
|
||||
preparation: Preparation
|
||||
delivery: Delivery
|
||||
agency: Agency
|
||||
warehouse: Store
|
||||
deliveryAddress: Delivery address
|
||||
total: Total
|
||||
|
@ -118,7 +117,6 @@ es-ES:
|
|||
shippingInformation: Datos de envío
|
||||
preparation: Preparación
|
||||
delivery: Entrega
|
||||
agency: Agencia
|
||||
warehouse: Almacén
|
||||
deliveryAddress: Dirección de entrega
|
||||
total: Total
|
||||
|
@ -127,7 +125,6 @@ ca-ES:
|
|||
shippingInformation: Dades d'enviament
|
||||
preparation: Preparació
|
||||
delivery: Lliurament
|
||||
agency: Agència
|
||||
warehouse: Magatzem
|
||||
deliveryAddress: Adreça de lliurament
|
||||
total: Total
|
||||
|
@ -144,7 +141,6 @@ pt-PT:
|
|||
shippingInformation: Dados de envio
|
||||
preparation: Preparação
|
||||
delivery: Entrega
|
||||
agency: Agência
|
||||
warehouse: Armazém
|
||||
deliveryAddress: Endereço de entrega
|
||||
total: Total
|
||||
|
|
|
@ -66,7 +66,7 @@ const routes = [
|
|||
},
|
||||
{
|
||||
name: 'checkout',
|
||||
path: '/ecomerce/checkout',
|
||||
path: '/ecomerce/checkout/:id?',
|
||||
component: () => import('pages/Ecomerce/CheckoutView.vue')
|
||||
},
|
||||
{
|
||||
|
|
Loading…
Reference in New Issue