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

merge with dev

This commit is contained in:
William Buezas 2024-01-31 11:31:06 -03:00
parent aa40a3b0f5 bcfe5098d8
commit 2bbd93748f
46 changed files with 563 additions and 423 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.js
View File

@ -58,7 +58,7 @@ module.exports = {
rules: {
'prefer-promise-reject-errors': 'off',
'no-unused-vars': 'warn',
"vue/no-multiple-template-root": "off" ,
// allow debugger during development only
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
},

2
Jenkinsfile vendored
View File

@ -96,4 +96,4 @@ pipeline {
}
}
}
}
}

3
package.json
View File

@ -25,8 +25,7 @@
"validator": "^13.9.0",
"vue": "^3.3.4",
"vue-i18n": "^9.2.2",
"vue-router": "^4.2.1",
"vue-router-mock": "^0.2.0"
"vue-router": "^4.2.1"
},
"devDependencies": {
"@intlify/unplugin-vue-i18n": "^0.8.1",

7
src/components/FormModel.vue
View File

@ -180,13 +180,6 @@ watch(formUrl, async () => {
});
</script>
<template>
<QBanner
v-if="$props.observeFormChanges && hasChanges"
class="text-white bg-warning full-width"
>
<QIcon name="warning" size="md" class="q-mr-md" />
<span>{{ t('globals.changesToSave') }}</span>
</QBanner>
<div class="column items-center full-width">
<QForm
v-if="formData"

36
src/components/UserPanel.vue
View File

@ -1,19 +1,19 @@
<script setup>
import { onMounted, computed } from 'vue';
import { Dark, Quasar, useQuasar } from 'quasar';
import { Dark, Quasar } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import axios from 'axios';
import { useState } from 'src/composables/useState';
import { useSession } from 'src/composables/useSession';
import { localeEquivalence } from "src/i18n/index";
import { localeEquivalence } from 'src/i18n/index';
const state = useState();
const session = useSession();
const router = useRouter();
const { t, locale } = useI18n();
const quasar = useQuasar();
import { useClipboard } from 'src/composables/useClipboard';
const { copyText } = useClipboard();
const userLocale = computed({
get() {
return locale.value;
@ -21,14 +21,14 @@ const userLocale = computed({
set(value) {
locale.value = value;
value = localeEquivalence[value] ?? value
value = localeEquivalence[value] ?? value;
try {
/* @vite-ignore */
import(`../../node_modules/quasar/lang/${value}.mjs`).then((lang) => {
Quasar.lang.set(lang.default);
});
} catch (error) {
} catch (error) {
//
}
},
@ -81,12 +81,8 @@ function logout() {
router.push('/login');
}
function copyUserToken(){
navigator.clipboard.writeText(session.getToken());
quasar.notify({
type: 'positive',
message: t('components.userPanel.copyToken'),
});
function copyUserToken() {
copyText(session.getToken(), { label: 'components.userPanel.copyToken' });
}
</script>
@ -129,8 +125,12 @@ function copyUserToken(){
<div class="text-subtitle1 q-mt-md">
<strong>{{ user.nickname }}</strong>
</div>
<div class="text-subtitle3 text-grey-7 q-mb-xs copyUserToken" @click="copyUserToken()" >@{{ user.name }}
</div>
<div
class="text-subtitle3 text-grey-7 q-mb-xs copyText"
@click="copyUserToken()"
>
@{{ user.name }}
</div>
<QBtn
id="logout"
@ -152,9 +152,9 @@ function copyUserToken(){
width: 150px;
}
.copyUserToken {
&:hover{
cursor: alias;
}
.copyText {
&:hover {
cursor: alias;
}
}
</style>

135
src/components/common/VnLocation.vue Normal file
View File

@ -0,0 +1,135 @@
<script setup>
import { ref, toRefs, computed, watch, onMounted } from 'vue';
import CreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
import VnSelectCreate from 'components/common/VnSelectCreate.vue';
import FetchData from 'components/FetchData.vue';
const emit = defineEmits(['update:modelValue', 'update:options']);
import { useI18n } from 'vue-i18n';
const { t } = useI18n();
const postcodesOptions = ref([]);
const postcodesRef = ref(null);
const $props = defineProps({
modelValue: {
type: [String, Number, Object],
default: null,
},
options: {
type: Array,
default: () => [],
},
optionLabel: {
type: String,
default: '',
},
optionValue: {
type: String,
default: '',
},
filterOptions: {
type: Array,
default: () => [],
},
isClearable: {
type: Boolean,
default: true,
},
defaultFilter: {
type: Boolean,
default: true,
},
});
const { options } = toRefs($props);
const myOptions = ref([]);
const myOptionsOriginal = ref([]);
const value = computed({
get() {
return $props.modelValue;
},
set(value) {
emit('update:modelValue', value);
},
});
onMounted(() => {
locationFilter()
});
function setOptions(data) {
myOptions.value = JSON.parse(JSON.stringify(data));
myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
}
setOptions(options.value);
watch(options, (newValue) => {
setOptions(newValue);
});
function showLabel(data) {
return `${data.code} - ${data.town}(${data.province}), ${data.country}`;
}
function locationFilter(search) {
let where = { search };
postcodesRef.value.fetch({filter:{ where}, limit: 30});
}
function handleFetch( data) {
postcodesOptions.value = data;
}
</script>
<template>
<FetchData
ref="postcodesRef"
url="Postcodes/filter"
@on-fetch="(data) =>handleFetch(data)"
/>
<VnSelectCreate
v-if="postcodesRef"
v-model="value"
:options="postcodesOptions"
:label="t('Location')"
:option-label="showLabel"
:placeholder="t('Search by postalCode, town, province or country')"
@input-value="locationFilter"
:default-filter="false"
:input-debounce="300"
:class="{ required: $attrs.required }"
v-bind="$attrs"
emit-value
map-options
use-input
clearable
hide-selected
fill-input
>
<template #form>
<CreateNewPostcode @on-data-saved="locationFilter()" />
</template>
<template #option="{itemProps, opt}">
<QItem v-bind="itemProps">
<QItemSection v-if="opt">
<QItemLabel>{{ opt.code }}</QItemLabel>
<QItemLabel caption>{{ showLabel(opt) }}</QItemLabel>
</QItemSection>
</QItem>
</template>
</VnSelectCreate>
</template>
<style lang="scss" scoped>
.add-icon {
cursor: pointer;
background-color: $primary;
border-radius: 50px;
}
</style>
<i18n>
es:
Location: Ubicación
Search by postalcode, town, province or country: Buscar por código postal, ciudad o país
</i18n>

65
src/components/common/VnLog.vue
View File

@ -168,17 +168,17 @@ function getLogTree(data) {
let originLog = null;
let userLog = null;
let modelLog = null;
let prevLog;
let nLogs;
data.forEach((log) => {
for (let i = 0; i < data.length; i++) {
let log = data[i];
let prevLog = i > 0 ? data[i - 1] : null;
const locale = validations[log.changedModel]?.locale || {};
// Origin
const originChanged = !prevLog || log.originFk != prevLog.originFk;
if (originChanged) {
logs.push((originLog = { originFk: log.originFk, logs: [] }));
prevLog = log;
}
// User
const userChanged = originChanged || log.userFk != prevLog.userFk;
@ -197,6 +197,7 @@ function getLogTree(data) {
log.changedModel != prevLog.changedModel ||
log.changedModelId != prevLog.changedModelId ||
nLogs >= 6;
if (modelChanged) {
userLog.logs.push(
(modelLog = {
@ -221,7 +222,7 @@ function getLogTree(data) {
propNames = [...new Set(propNames)];
log.props = parseProps(propNames, locale, vals, olds);
});
}
return logs;
}
@ -320,7 +321,6 @@ function selectFilter(type, dateType) {
}
if (type === 'action' && selectedFilters.value.changedModel === null) {
selectedFilters.value.changedModel = undefined;
reload = false;
}
if (type === 'userRadio') {
selectedFilters.value.userFk = userRadio.value;
@ -415,18 +415,19 @@ setLogTree();
<div class="line bg-grey"></div>
</QItem>
<div
class="user-log q-mb-sm row"
class="user-log q-mb-sm"
v-for="(userLog, userIndex) in originLog.logs"
:key="userIndex"
>
<div class="timeline">
<div class="user-avatar">
<VnUserLink v-if="userLog.user.image" :worker-id="userLog.user.id">
<VnUserLink :worker-id="userLog.user.id">
<template #link>
<VnAvatar
:class="{ 'cursor-pointer': userLog.user.id }"
:worker-id="userLog.user.id"
:title="userLog.user.nickname"
size="lg"
/>
</template>
</VnUserLink>
@ -665,7 +666,6 @@ setLogTree();
option-label="locale"
:options="actions"
@update:model-value="selectFilter('action')"
@clear="() => selectFilter('action')"
hide-selected
/>
</QItem>
@ -823,14 +823,30 @@ setLogTree();
.q-item {
min-height: 0px;
}
.q-menu {
display: block;
& > .loading {
display: flex;
justify-content: center;
}
& > .q-card {
min-width: 180px;
max-width: 400px;
& > .header {
color: $dark;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}
.origin-log {
&:first-child > .origin-info {
margin-top: 0;
}
& > .origin-info {
width: 100%;
max-width: 42em;
margin-top: 28px;
gap: 6px;
@ -847,14 +863,15 @@ setLogTree();
}
}
.user-log {
display: flex;
width: 100%;
max-width: 40em;
& > .timeline {
position: relative;
padding-right: 5px;
width: 50px;
padding-right: 1px;
width: 38px;
min-width: 38px;
flex-grow: auto;
& > .arrow {
height: 8px;
width: 8px;
@ -874,7 +891,7 @@ setLogTree();
position: absolute;
background-color: $primary;
width: 2px;
left: 23px;
left: 19px;
z-index: -1;
top: 0;
bottom: -8px;
@ -893,6 +910,7 @@ setLogTree();
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
min-height: 22px;
.model-value {
font-style: italic;
}
@ -984,25 +1002,6 @@ setLogTree();
}
}
}
.q-menu {
display: block;
& > .loading {
display: flex;
justify-content: center;
}
& > .q-card {
min-width: 180px;
max-width: 400px;
& > .header {
color: $dark;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}
</style>
<i18n>
en:

5
src/components/common/VnSelectFilter.vue
View File

@ -12,11 +12,11 @@ const $props = defineProps({
default: () => [],
},
optionLabel: {
type: String,
type: [String],
default: '',
},
filterOptions: {
type: Array,
type: [Array],
default: () => [],
},
isClearable: {
@ -47,6 +47,7 @@ function setOptions(data) {
myOptions.value = JSON.parse(JSON.stringify(data));
myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
}
setOptions(options.value);
const filter = (val, options) => {
const search = val.toString().toLowerCase();

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

@ -49,7 +49,6 @@ onMounted(async () => {
() => $props.url,
async (newUrl, lastUrl) => {
if (newUrl == lastUrl) return;
entity.value = null;
await getData();
}
);
@ -62,7 +61,6 @@ async function getData() {
skip: 0,
});
const { data } = await arrayData.fetch({ append: false, updateRouter: false });
entity.value = data;
emit('onFetch', data);
}
const emit = defineEmits(['onFetch']);

20
src/components/ui/VnAvatar.vue
View File

@ -1,19 +1,37 @@
<script setup>
import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useSession } from 'src/composables/useSession';
import { useColor } from 'src/composables/useColor';
const $props = defineProps({
workerId: { type: Number, required: true },
description: { type: String, default: null },
size: { type: String, default: null },
title: { type: String, default: null },
});
const session = useSession();
const token = session.getToken();
const { t } = useI18n();
const title = computed(() => $props.title ?? t('globals.system'));
const showLetter = ref(false);
</script>
<template>
<div class="avatar-picture column items-center">
<QAvatar color="orange">
<QAvatar
:style="{
backgroundColor: useColor(title),
}"
:size="$props.size"
:title="title"
>
<template v-if="showLetter">{{ title.charAt(0) }}</template>
<QImg
v-else
:src="`/api/Images/user/160x160/${$props.workerId}/download?access_token=${token}`"
spinner-color="white"
@error="showLetter = true"
/>
</QAvatar>
<div class="description">

8
src/components/ui/VnFilterPanel.vue
View File

@ -64,10 +64,12 @@ onMounted(() => {
});
const isLoading = ref(false);
async function search() {
isLoading.value = true;
const params = { ...userParams.value };
store.userParamsChanged = true;
store.filter.skip = 0;
store.skip = 0;
const { params: newParams } = await arrayData.addFilter({ params });
userParams.value = newParams;
@ -89,7 +91,9 @@ async function reload() {
async function clearFilters() {
isLoading.value = true;
store.userParamsChanged = true;
store.filter.skip = 0;
store.skip = 0;
// Filtrar los params no removibles
const removableFilters = Object.keys(userParams.value).filter((param) =>
props.unremovableParams.includes(param)

23
src/components/ui/VnLv.vue
View File

@ -2,6 +2,7 @@
import { computed } from 'vue';
import { dashIfEmpty } from 'src/filters';
import { useClipboard } from 'src/composables/useClipboard';
const $props = defineProps({
label: { type: String, default: null },
value: {
@ -10,8 +11,19 @@ const $props = defineProps({
},
info: { type: String, default: null },
dash: { type: Boolean, default: true },
copy: { type: Boolean, default: false },
});
const isBooleanValue = computed(() => typeof $props.value === 'boolean');
const { copyText } = useClipboard();
function copyValueText() {
copyText($props.value, {
component: {
copyValue: $props.value,
},
});
}
</script>
<style scoped>
.label,
@ -48,5 +60,16 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
</QTooltip>
</QIcon>
</div>
<div class="copy" v-if="$props.copy && $props.value" @click="copyValueText()">
<QIcon name="Content_Copy" color="primary" />
</div>
</div>
</template>
<style lang="scss" scoped>
.copy {
&:hover {
cursor: pointer;
}
}
</style>

10
src/components/ui/VnPaginate.vue
View File

@ -104,6 +104,8 @@ async function paginate() {
await arrayData.loadMore();
if (!arrayData.hasMoreData.value) {
if (store.userParamsChanged) arrayData.hasMoreData.value = true;
store.userParamsChanged = false;
isLoading.value = false;
return;
}
@ -129,9 +131,9 @@ async function onLoad(...params) {
pagination.value.page = pagination.value.page + 1;
await paginate();
const endOfPages = !arrayData.hasMoreData.value;
done(endOfPages);
let isDone = false;
if (store.userParamsChanged) isDone = !arrayData.hasMoreData.value;
done(isDone);
}
</script>
@ -172,7 +174,7 @@ async function onLoad(...params) {
v-if="store.data"
@load="onLoad"
:offset="offset"
class="full-width full-height overflow-auto"
class="full-width full-height"
>
<slot name="body" :rows="store.data"></slot>
<div v-if="isLoading" class="info-row q-pa-md text-center">

13
src/components/ui/VnSearchbar.vue
View File

@ -87,15 +87,10 @@ async function search() {
});
if (!props.redirect) return;
const rows = store.data;
const module = route.matched[1];
if (rows.length === 1) {
const [firstRow] = rows;
await router.push({ path: `${module.path}/${firstRow.id}` });
} else if (route.matched.length > 3) {
await router.push({ path: `/${module.path}` });
arrayData.updateStateParams();
}
const { matched: matches } = route;
const { path } = matches[matches.length-1];
const newRoute = path.replace(':id', searchText.value);
await router.push(newRoute);
}
</script>

25
src/components/ui/VnSubToolbar.vue
View File

@ -1,6 +1,7 @@
<script setup>
import { onMounted, onUnmounted, ref } from 'vue';
import { onMounted, onUnmounted } from 'vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
onMounted(() => {
@ -13,9 +14,25 @@ onUnmounted(() => {
</script>
<template>
<QToolbar class="bg-vn-dark justify-end">
<div id="st-data"></div>
<QToolbar class="bg-vn-dark justify-end sticky">
<slot name="st-data">
<div id="st-data"></div>
</slot>
<QSpace />
<div id="st-actions"></div>
<slot name="st-actions">
<div id="st-actions"></div>
</slot>
</QToolbar>
</template>
<style lang="scss" scoped>
.sticky {
position: sticky;
top: 61px;
z-index: 1;
}
@media (max-width: $breakpoint-sm) {
.sticky {
top: 90px;
}
}
</style>

2
src/composables/tMobile.js
View File

@ -4,5 +4,5 @@ import { useI18n } from 'vue-i18n';
export function tMobile(...args) {
const quasar = useQuasar();
const { t } = useI18n();
if (!quasar.platform.is.mobile) return t(...args);
if (!quasar.screen.xs) return t(...args);
}

3
src/composables/useArrayData.js
View File

@ -142,7 +142,8 @@ export function useArrayData(key, userOptions) {
userParams = sanitizerParams(userParams, store?.exprBuilder);
store.userParams = userParams;
store.skip = 0;
store.filter.skip = 0;
await fetch({ append: false });
return { filter, params };
}

17
src/composables/useClipboard.js Normal file
View File

@ -0,0 +1,17 @@
import { useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n';
export function useClipboard() {
const quasar = useQuasar();
const { t } = useI18n();
/**
*
* @param {String} value Value to send to clipboardAPI
* @param {Object} {label, component} Refer to Quasar notify configuration. Label is the text to translate
*/
function copyText(value, { label = 'components.VnLv.copyText', component = {} }) {
navigator.clipboard.writeText(value);
quasar.notify({ type: 'positive', message: t(label, component) });
}
return { copyText };
}

54
src/pages/Claim/Card/ClaimAction.vue
View File

@ -37,6 +37,7 @@ const marker_labels = [
{ value: DEFAULT_MIN_RESPONSABILITY, label: t('claim.summary.company') },
{ value: DEFAULT_MAX_RESPONSABILITY, label: t('claim.summary.person') },
];
const multiplicatorValue = ref();
const columns = computed(() => [
{
@ -134,17 +135,7 @@ async function regularizeClaim() {
message: t('globals.dataSaved'),
type: 'positive',
});
if (claim.value.responsibility >= Math.ceil(DEFAULT_MAX_RESPONSABILITY) / 2) {
quasar
.dialog({
component: VnConfirm,
componentProps: {
title: t('confirmGreuges'),
message: t('confirmGreugesMessage'),
},
})
.onOk(async () => await onUpdateGreugeAccept());
}
await onUpdateGreugeAccept();
}
async function onUpdateGreugeAccept() {
@ -153,9 +144,9 @@ async function onUpdateGreugeAccept() {
filter: { where: { code: 'freightPickUp' } },
})
).data.id;
const freightPickUpPrice = (await axios.get(`GreugeConfigs/findOne`)).data
.freightPickUpPrice;
const freightPickUpPrice =
(await axios.get(`GreugeConfigs/findOne`)).data.freightPickUpPrice *
multiplicatorValue.value;
await axios.post(`Greuges`, {
clientFk: claim.value.clientFk,
description: `${t('ClaimGreugeDescription')} ${claimId}`.toUpperCase(),
@ -226,10 +217,10 @@ async function importToNewRefundTicket() {
show-if-above
v-if="claim"
>
<QCard class="totalClaim vn-card q-my-md q-pa-sm">
<QCard class="totalClaim q-my-md q-pa-sm no-box-shadow">
{{ `${t('Total claimed')}: ${toCurrency(totalClaimed)}` }}
</QCard>
<QCard class="vn-card q-mb-md q-pa-sm">
<QCard class="q-mb-md q-pa-sm no-box-shadow">
<QItem class="justify-between">
<QItemLabel class="slider-container">
<p class="text-primary">
@ -250,13 +241,31 @@ async function importToNewRefundTicket() {
</QItemLabel>
</QItem>
</QCard>
<QItemLabel class="mana q-mb-md">
<QCheckbox
v-model="claim.isChargedToMana"
@update:model-value="(value) => save({ isChargedToMana: value })"
<QCard class="q-mb-md q-pa-sm no-box-shadow" style="margin-bottom: 1em">
<QItemLabel class="mana q-mb-md">
<QCheckbox
v-model="claim.isChargedToMana"
@update:model-value="(value) => save({ isChargedToMana: value })"
/>
<span>{{ t('mana') }}</span>
</QItemLabel>
</QCard>
<QCard class="q-mb-md q-pa-sm no-box-shadow" style="position: static">
<QInput
:disable="
!(claim.responsibility >= Math.ceil(DEFAULT_MAX_RESPONSABILITY) / 2)
"
:label="t('confirmGreuges')"
class="q-field__native text-grey-2"
type="number"
placeholder="0"
id="multiplicatorValue"
name="multiplicatorValue"
min="0"
max="50"
v-model="multiplicatorValue"
/>
<span>{{ t('mana') }}</span>
</QItemLabel>
</QCard>
</QDrawer>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> </Teleport>
<CrudModel
@ -494,4 +503,5 @@ es:
Id item: Id artículo
confirmGreuges: ¿Desea insertar greuges?
confirmGreugesMessage: Insertar greuges en la ficha del cliente
Apply Greuges: Aplicar Greuges
</i18n>

14
src/pages/Claim/Card/ClaimCard.vue
View File

@ -1,27 +1,13 @@
<script setup>
import LeftMenu from 'components/LeftMenu.vue';
import { getUrl } from 'composables/getUrl';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import { useStateStore } from 'stores/useStateStore';
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import ClaimDescriptor from './ClaimDescriptor.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
const stateStore = useStateStore();
const { t } = useI18n();
const route = useRoute();
const $props = defineProps({
id: {
type: Number,
required: false,
default: null,
},
});
const entityId = computed(() => {
return $props.id || route.params.id;
});
</script>
<template>
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">

23
src/pages/Claim/Card/ClaimDescriptor.vue
View File

@ -2,7 +2,7 @@
import { ref, computed } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { toDate } from 'src/filters';
import { toDate, toPercentage } from 'src/filters';
import { useState } from 'src/composables/useState';
import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue';
@ -32,7 +32,16 @@ const filter = {
{
relation: 'client',
scope: {
include: { relation: 'salesPersonUser' },
include: [
{ relation: 'salesPersonUser' },
{
relation: 'claimsRatio',
scope: {
fields: ['claimingRate'],
limit: 1,
},
},
],
},
},
{
@ -135,6 +144,10 @@ const setData = (entity) => {
:value="entity.ticket?.address?.province?.name"
/>
<VnLv :label="t('claim.card.zone')" :value="entity.ticket?.zone?.name" />
<VnLv
:label="t('claimRate')"
:value="toPercentage(entity.client?.claimsRatio?.claimingRate)"
/>
</template>
<template #actions="{ entity }">
<QCardActions>
@ -163,3 +176,9 @@ const setData = (entity) => {
margin-top: 0;
}
</style>
<i18n>
en:
claimRate: Claming rate
es:
claimRate: Ratio de reclamación
</i18n>

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

@ -4,12 +4,11 @@ import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import { useRoute } from 'vue-router';
import { useArrayData } from 'composables/useArrayData';
import { useStateStore } from 'stores/useStateStore';
import { useArrayData } from 'composables/useArrayData';
import { toDate, toCurrency, toPercentage } from 'filters/index';
import CrudModel from 'components/CrudModel.vue';
import FetchData from 'components/FetchData.vue';
import { toDate, toCurrency, toPercentage } from 'filters/index';
import VnDiscount from 'components/common/vnDiscount.vue';
import ClaimLinesImport from './ClaimLinesImport.vue';
@ -158,23 +157,21 @@ function showImportDialog() {
</script>
<template>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
<QToolbar>
<div class="row q-gutter-md">
<div>
{{ t('Amount') }}
<QChip :dense="$q.screen.lt.sm">
{{ toCurrency(amount) }}
</QChip>
</div>
<QSeparator dark vertical />
<div>
{{ t('Amount Claimed') }}
<QChip color="positive" :dense="$q.screen.lt.sm">
{{ toCurrency(amountClaimed) }}
</QChip>
</div>
<div class="row q-gutter-md">
<div>
{{ t('Amount') }}
<QChip :dense="$q.screen.lt.sm">
{{ toCurrency(amount) }}
</QChip>
</div>
</QToolbar>
<QSeparator dark vertical />
<div>
{{ t('Amount Claimed') }}
<QChip color="positive" :dense="$q.screen.lt.sm">
{{ toCurrency(amountClaimed) }}
</QChip>
</div>
</div>
</Teleport>
<FetchData

2
src/pages/Claim/Card/ClaimNotes.vue
View File

@ -30,7 +30,7 @@ const body = {
</script>
<template>
<div class="column items-center">
<VnNotes
<VnNotes style="overflow-y: scroll;"
:add-note="$props.addNote"
:id="id"
url="claimObservations"

16
src/pages/Claim/ClaimList.vue
View File

@ -87,20 +87,22 @@ function viewSummary(id) {
v-for="row of rows"
>
<template #list-items>
<VnLv :label="t('claim.list.customer')" @click.stop>
<VnLv :label="t('claim.list.customer')">
<template #value>
<span class="link">
<span class="link" @click.stop>
{{ row.clientName }}
<CustomerDescriptorProxy :id="row.clientFk" />
</span>
</template>
</VnLv>
<VnLv :label="t('claim.list.assignedTo')" @click.stop>
<VnLv :label="t('claim.list.assignedTo')">
<template #value>
<VnUserLink
:name="row.workerName"
:worker-id="row.workerFk"
/>
<span @click.stop>
<VnUserLink
:name="row.workerName"
:worker-id="row.workerFk"
/>
</span>
</template>
</VnLv>
<VnLv

4
src/pages/Customer/Card/CustomerSummary.vue
View File

@ -38,7 +38,7 @@ const balanceDue = computed(() => {
const balanceDueWarning = computed(() => (balanceDue.value ? 'negative' : ''));
const claimRate = computed(() => {
return customer.value.claimsRatio.claimingRate * 100;
return customer.value.claimsRatio.claimingRate;
});
const priceIncreasingRate = computed(() => {
@ -81,7 +81,7 @@ const creditWarning = computed(() => {
<VnLinkPhone :phone-number="entity.mobile" />
</template>
</VnLv>
<VnLv :label="t('customer.summary.email')" :value="entity.email" />
<VnLv :label="t('customer.summary.email')" :value="entity.email" copy />
<VnLv
:label="t('customer.summary.salesPerson')"
:value="entity?.salesPersonUser?.name"

137
src/pages/Customer/CustomerCreate.vue
View File

@ -2,12 +2,11 @@
import { reactive, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import CustomerCreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
import FetchData from 'components/FetchData.vue';
import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnSelectCreate from 'src/components/common/VnSelectCreate.vue';
import VnLocation from 'src/components/common/VnLocation.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
const { t } = useI18n();
@ -29,23 +28,18 @@ const newClientForm = reactive({
isEqualizated: false,
});
const postcodeFetchDataRef = ref(null);
const townsFetchDataRef = ref(null);
const workersOptions = ref([]);
const businessTypesOptions = ref([]);
const citiesLocationOptions = ref([]);
const provincesLocationOptions = ref([]);
const countriesOptions = ref([]);
const postcodesOptions = ref([]);
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
await postcodeFetchDataRef.value.fetch();
await townsFetchDataRef.value.fetch();
formData.postcode = code;
formData.provinceFk = provinceFk;
formData.city = citiesLocationOptions.value.find((town) => town.id === townFk).name;
formData.countryFk = countryFk;
};
function handleLocation(data, location ) {
const { town, code, provinceFk, countryFk } = location ?? {}
data.postcode = code;
data.city = town;
data.provinceFk = provinceFk;
data.countryFk = countryFk;
}
</script>
<template>
@ -54,33 +48,11 @@ const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formDa
auto-load
url="Workers/search?departmentCodes"
/>
<FetchData
ref="postcodeFetchDataRef"
url="Postcodes/location"
@on-fetch="(data) => (postcodesOptions = data)"
auto-load
/>
<FetchData
@on-fetch="(data) => (businessTypesOptions = data)"
auto-load
url="BusinessTypes"
/>
<FetchData
ref="townsFetchDataRef"
@on-fetch="(data) => (citiesLocationOptions = data)"
auto-load
url="Towns/location"
/>
<FetchData
@on-fetch="(data) => (provincesLocationOptions = data)"
auto-load
url="Provinces/location"
/>
<FetchData
@on-fetch="(data) => (countriesOptions = data)"
auto-load
url="Countries"
/>
<QPage>
<VnSubToolbar />
<FormModel
@ -139,96 +111,19 @@ const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formDa
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectCreate
v-model="data.postcode"
:label="t('Postcode')"
<VnLocation
:rules="validate('Worker.postcode')"
:roles-allowed-to-create="['deliveryAssistant']"
:options="postcodesOptions"
option-label="code"
option-value="code"
hide-selected
v-model="data.location"
@update:model-value="
(location) => handleLocation(data, location)
"
>
<template #form>
<CustomerCreateNewPostcode
@on-data-saved="onPostcodeCreated($event, data)"
/>
</template>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection v-if="scope.opt">
<QItemLabel>{{ scope.opt.code }}</QItemLabel>
<QItemLabel caption
>{{ scope.opt.code }} -
{{ scope.opt.town.name }} ({{
scope.opt.town.province.name
}},
{{
scope.opt.town.province.country.country
}})</QItemLabel
>
</QItemSection>
</QItem>
</template>
</VnSelectCreate>
</div>
<div class="col">
<!-- ciudades -->
<VnSelectFilter
:label="t('City')"
:options="citiesLocationOptions"
hide-selected
option-label="name"
option-value="name"
v-model="data.city"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>{{ scope.opt.name }}</QItemLabel>
<QItemLabel caption>
{{
`${scope.opt.name}, ${scope.opt.province.name} (${scope.opt.province.country.country})`
}}
</QItemLabel>
</QItemSection>
</QItem>
</template>
</VnSelectFilter>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectFilter
:label="t('Province')"
:options="provincesLocationOptions"
hide-selected
option-label="name"
option-value="id"
v-model="data.provinceFk"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>{{
`${scope.opt.name} (${scope.opt.country.country})`
}}</QItemLabel>
</QItemSection>
</QItem>
</template>
</VnSelectFilter>
</div>
<div class="col">
<VnSelectFilter
:label="t('Country')"
:options="countriesOptions"
hide-selected
option-label="country"
option-value="id"
v-model="data.countryFk"
/>
</VnLocation>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QInput v-model="data.userName" :label="t('Web user')" />

9
src/pages/Customer/Defaulter/CustomerDefaulter.vue
View File

@ -12,6 +12,7 @@ import CustomerNotificationsFilter from './CustomerDefaulterFilter.vue';
import CustomerBalanceDueTotal from './CustomerBalanceDueTotal.vue';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import CustomerDefaulterAddObservation from './CustomerDefaulterAddObservation.vue';
const { t } = useI18n();
@ -206,8 +207,8 @@ const refreshData = () => {
</QScrollArea>
</QDrawer>
<QToolbar class="bg-vn-dark">
<div id="st-data" class="row">
<VnSubToolbar class="bg-vn-dark">
<template #st-data>
<CustomerBalanceDueTotal :amount="balanceDueTotal" />
<div class="flex items-center q-ml-lg">
<QBtn
@ -217,8 +218,8 @@ const refreshData = () => {
@click.stop="viewAddObservation(selected)"
/>
</div>
</div>
</QToolbar>
</template>
</VnSubToolbar>
<QPage class="column items-center q-pa-md">
<QTable

12
src/pages/Customer/ExtendedList/CustomerExtendedList.vue
View File

@ -9,6 +9,7 @@ import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorP
import CustomerExtendedListActions from './CustomerExtendedListActions.vue';
import CustomerExtendedListFilter from './CustomerExtendedListFilter.vue';
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useArrayData } from 'composables/useArrayData';
import { useStateStore } from 'stores/useStateStore';
@ -499,9 +500,8 @@ const selectSalesPersonId = (id) => {
/>
</QScrollArea>
</QDrawer>
<QToolbar class="bg-vn-dark">
<div id="st-data">
<VnSubToolbar>
<template #st-actions>
<TableVisibleColumns
:all-columns="allColumnNames"
table-code="clientsDetail"
@ -510,10 +510,8 @@ const selectSalesPersonId = (id) => {
visibleColumns = ['customerStatus', ...$event, 'actions']
"
/>
</div>
<QSpace />
<div id="st-actions"></div>
</QToolbar>
</template>
</VnSubToolbar>
<QPage class="column items-center q-pa-md">
<QTable

6
src/pages/Department/Card/DepartmentDescriptor.vue
View File

@ -90,17 +90,15 @@ const removeDepartment = () => {
</QItem>
</template>
<template #body="{ entity }">
<VnLv :label="t('department.chat')" :value="entity.chatName" dash />
<VnLv :label="t('department.email')" :value="entity.notificationEmail" dash />
<VnLv :label="t('department.chat')" :value="entity.chatName" />
<VnLv :label="t('department.email')" :value="entity.notificationEmail" copy />
<VnLv
:label="t('department.selfConsumptionCustomer')"
:value="entity.client?.name"
dash
/>
<VnLv
:label="t('department.bossDepartment')"
:value="entity.worker?.user?.name"
dash
/>
</template>
<template #actions>

1
src/pages/InvoiceIn/InvoiceInList.vue
View File

@ -76,7 +76,6 @@ function viewSummary(id) {
data-key="InvoiceInList"
url="InvoiceIns/filter"
order="issued DESC, id DESC"
auto-load
>
<template #body="{ rows }">
<CardList

9
src/pages/InvoiceOut/InvoiceOutList.vue
View File

@ -11,6 +11,7 @@ import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import InvoiceOutFilter from './InvoiceOutFilter.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import CardList from 'src/components/ui/CardList.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
const { t } = useI18n();
const selectedCards = ref(new Map());
@ -129,8 +130,8 @@ const downloadCsv = () => {
url="InvoiceOuts/filter"
>
<template #body="{ rows }">
<QToolbar class="bg-vn-dark justify-end">
<div id="st-actions">
<VnSubToolbar class="bg-vn-dark justify-end">
<template #st-actions>
<QBtn
@click="downloadCsv()"
class="q-mr-xl"
@ -178,8 +179,8 @@ const downloadCsv = () => {
:model-value="selectedCards.size === rows.length"
class="q-mr-md"
/>
</div>
</QToolbar>
</template>
</VnSubToolbar>
<div class="flex flex-center q-pa-md">
<div class="vn-card-list">
<CardList

7
src/pages/Order/Card/OrderCatalogItem.vue
View File

@ -57,13 +57,6 @@ const dialog = ref(null);
:value="item?.[`value${index + 4}`]"
/>
</template>
<QRating
:model-value="item.stars"
icon="star"
icon-selected="star"
color="primary"
readonly
/>
<div class="footer">
<div class="price">
<p>{{ item.available }} {{ t('to') }} {{ item.price }}</p>

9
src/pages/Route/RouteList.vue
View File

@ -15,6 +15,7 @@ import RouteSearchbar from 'pages/Route/Card/RouteSearchbar.vue';
import RouteFilter from 'pages/Route/Card/RouteFilter.vue';
import { useQuasar } from 'quasar';
import RouteSummaryDialog from 'pages/Route/Card/RouteSummaryDialog.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
const stateStore = useStateStore();
const { t } = useI18n();
@ -228,8 +229,8 @@ function previewRoute(id) {
<FetchData url="AgencyModes" @on-fetch="(data) => (agencyList = data)" auto-load />
<FetchData url="Vehicles" @on-fetch="(data) => (vehicleList = data)" auto-load />
<QPage class="column items-center">
<QToolbar class="bg-vn-dark justify-end">
<div id="st-actions" class="q-pa-sm">
<VnSubToolbar class="bg-vn-dark justify-end">
<template #st-actions>
<QBtn
icon="vn:clone"
color="primary"
@ -249,8 +250,8 @@ function previewRoute(id) {
>
<QTooltip>{{ t('Mark as served') }}</QTooltip>
</QBtn>
</div>
</QToolbar>
</template>
</VnSubToolbar>
<div class="route-list">
<VnPaginate
:key="refreshKey"

6
src/pages/Ticket/Card/TicketSummary.vue
View File

@ -58,7 +58,7 @@ function formattedAddress() {
function isEditable() {
try {
return !ticket.value.ticketState.state.alertLevel;
return !ticket.value.ticketState?.state?.alertLevel;
} catch (e) {
console.error(e);
}
@ -153,8 +153,8 @@ async function changeState(value) {
</a>
<VnLv :label="t('ticket.summary.state')">
<template #value>
<QChip :color="ticket.ticketState.state.classColor ?? 'dark'">
{{ ticket.ticketState.state.name }}
<QChip :color="ticket.ticketState?.state?.classColor ?? 'dark'">
{{ ticket.ticketState?.state?.name }}
</QChip>
</template>
</VnLv>

11
src/pages/Travel/ExtraCommunity.vue
View File

@ -17,6 +17,7 @@ import { useArrayData } from 'composables/useArrayData';
import { toDate } from 'src/filters';
import { usePrintService } from 'composables/usePrintService';
import travelService from 'src/services/travel.service';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
const router = useRouter();
const stateStore = useStateStore();
@ -259,10 +260,8 @@ onMounted(async () => {
/>
</Teleport>
</template>
<QToolbar class="bg-vn-dark justify-end">
<div id="st-data"></div>
<QSpace />
<div id="st-actions">
<VnSubToolbar class="bg-vn-dark justify-end">
<template #st-actions>
<QBtn
color="primary"
icon-right="picture_as_pdf"
@ -273,8 +272,8 @@ onMounted(async () => {
{{ t('Open as PDF') }}
</QTooltip>
</QBtn>
</div>
</QToolbar>
</template>
</VnSubToolbar>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8">
<ExtraCommunityFilter data-key="ExtraCommunity" />

2
src/pages/Worker/Card/WorkerDescriptor.vue
View File

@ -101,7 +101,7 @@ const setData = (entity) => {
</template>
<template #body="{ entity }">
<VnLv :label="t('worker.card.name')" :value="entity.user?.nickname" />
<VnLv :label="t('worker.card.email')" :value="entity.user?.email"> </VnLv>
<VnLv :label="t('worker.card.email')" :value="entity.user?.email" copy />
<VnLv
:label="t('worker.list.department')"
:value="entity.department ? entity.department.department.name : null"

2
src/pages/Worker/Card/WorkerSummary.vue
View File

@ -80,7 +80,7 @@ const filter = {
:label="t('worker.list.department')"
:value="worker.department.department.name"
/>
<VnLv :label="t('worker.list.email')" :value="worker.user.email" />
<VnLv :label="t('worker.list.email')" :value="worker.user.email" copy />
<VnLv :label="t('worker.summary.boss')" link>
<template #value>
<VnUserLink

120
src/pages/Worker/WorkerCreate.vue
View File

@ -10,6 +10,7 @@ import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnSelectCreate from 'src/components/common/VnSelectCreate.vue';
import CreateBankEntityForm from 'src/components/CreateBankEntityForm.vue';
import CustomerCreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
import VnLocation from 'src/components/common/VnLocation.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
@ -21,14 +22,6 @@ const workerConfigFilter = {
field: ['payMethodFk'],
};
const provincesFilter = {
fields: ['id', 'name', 'countryFk'],
};
const townsFilter = {
fields: ['id', 'name', 'provinceFk'],
};
const newWorkerForm = ref({
companyFk: null,
payMethodFk: null,
@ -49,10 +42,6 @@ const newWorkerForm = ref({
bankEntityFk: null,
});
const postcodeFetchDataRef = ref(null);
const townsFetchDataRef = ref(null);
const provincesOptions = ref([]);
const townsOptions = ref([]);
const companiesOptions = ref([]);
const workersOptions = ref([]);
const payMethodsOptions = ref([]);
@ -67,13 +56,14 @@ const onBankEntityCreated = (data) => {
bankEntitiesOptions.value.push(data);
};
const onPostcodeCreated = async ({ code, provinceFk, townFk }, formData) => {
await postcodeFetchDataRef.value.fetch();
await townsFetchDataRef.value.fetch();
formData.postcode = code;
formData.provinceFk = provinceFk;
formData.city = townsOptions.value.find((town) => town.id === townFk).name;
};
function handleLocation(data, location ) {
const { town, postcode: code, provinceFk, countryFk } = location ?? {}
data.postcode = code;
data.city = town;
data.provinceFk = provinceFk;
data.countryFk = countryFk;
}
onMounted(async () => {
const userInfo = await useUserConfig().fetch();
@ -88,25 +78,7 @@ onMounted(async () => {
:filter="workerConfigFilter"
auto-load
/>
<FetchData
ref="postcodeFetchDataRef"
url="Postcodes/location"
@on-fetch="(data) => (postcodesOptions = data)"
auto-load
/>
<FetchData
url="Provinces/location"
@on-fetch="(data) => (provincesOptions = data)"
:filter="provincesFilter"
auto-load
/>
<FetchData
ref="townsFetchDataRef"
url="Towns/location"
@on-fetch="(data) => (townsOptions = data)"
:filter="townsFilter"
auto-load
/>
<FetchData
url="Companies"
@on-fetch="(data) => (companiesOptions = data)"
@ -184,77 +156,19 @@ onMounted(async () => {
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectCreate
v-model="data.postcode"
:label="t('worker.create.postcode')"
<VnLocation
:rules="validate('Worker.postcode')"
:roles-allowed-to-create="['deliveryAssistant']"
:options="postcodesOptions"
option-label="code"
option-value="code"
hide-selected
>
<template #form>
<CustomerCreateNewPostcode
@on-data-saved="onPostcodeCreated($event, data)"
/>
</template>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection v-if="scope.opt">
<QItemLabel>{{ scope.opt.code }}</QItemLabel>
<QItemLabel caption
>{{ scope.opt.code }} -
{{ scope.opt.town.name }} ({{
scope.opt.town.province.name
}},
{{
scope.opt.town.province.country.country
}})</QItemLabel
>
</QItemSection>
</QItem>
</template>
</VnSelectCreate>
</div>
<div class="col">
<VnSelectFilter
:label="t('worker.create.province')"
v-model="data.provinceFk"
:options="provincesOptions"
option-value="id"
option-label="name"
hide-selected
:rules="validate('Worker.provinceFk')"
/>
v-model="data.location"
@update:model-value="
(location) => handleLocation(data, location)
"
>
</VnLocation>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectFilter
:label="t('worker.create.city')"
v-model="data.city"
:options="townsOptions"
option-value="name"
option-label="name"
hide-selected
:rules="validate('Worker.city')"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>{{ scope.opt.name }}</QItemLabel>
<QItemLabel caption
>{{ scope.opt.name }},
{{ scope.opt.province.name }} ({{
scope.opt.province.country.country
}})</QItemLabel
>
</QItemSection>
</QItem>
</template>
</VnSelectFilter>
</div>
<div class="col">
<VnInput
:label="t('worker.create.street')"

1
src/stores/useArrayDataStore.js
View File

@ -19,6 +19,7 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
order: '',
data: ref(),
isLoading: false,
userParamsChanged: false,
exprBuilder: null,
};
}

31
test/cypress/integration/VnLocation.spec.js Normal file
View File

@ -0,0 +1,31 @@
const inputLocation = ':nth-child(3) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control';
const locationOptions ='[role="listbox"] > div.q-virtual-scroll__content > .q-item'
describe('VnLocation', () => {
beforeEach(() => {
cy.viewport(1280, 720);
cy.login('developer');
cy.visit('/#/worker/create');
cy.waitForElement('.q-card');
});
it('Show all options', function() {
cy.get(inputLocation).click();
cy.get(locationOptions).should('have.length',5);
});
it('input filter location as "al"', function() {
cy.get(inputLocation).click();
cy.get(inputLocation).clear();
cy.get(inputLocation).type('al');
cy.get(locationOptions).should('have.length',3);
});
it('input filter location as "ecuador"', function() {
cy.get(inputLocation).click();
cy.get(inputLocation).clear();
cy.get(inputLocation).type('ecuador');
cy.get(locationOptions).should('have.length',1);
cy.get(`${locationOptions}:nth-child(1)`).click();
cy.get(':nth-child(3) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .q-icon').click();
});
})

1
test/cypress/integration/claim/claimAction.spec.js
View File

@ -31,7 +31,6 @@ describe('ClaimAction', () => {
it('should regularize', () => {
cy.get('[title="Regularize"]').click();
cy.clickConfirm();
});
it('should remove the line', () => {

1
test/cypress/integration/invoiceIn/invoiceInList.spec.js
View File

@ -9,6 +9,7 @@ describe('InvoiceInList', () => {
beforeEach(() => {
cy.login('developer');
cy.visit(`/#/invoice-in`);
cy.clickFilterSearchBtn();
});
it('should redirect on clicking a invoice', () => {

19
test/cypress/integration/vnSearchBar.spec.js Normal file
View File

@ -0,0 +1,19 @@
/// <reference types="cypress" />
describe('VnSearchBar', () => {
beforeEach(() => {
cy.login('developer');
cy.visit('/');
});
it('should redirect to new customer', () => {
cy.visit('#/customer/1112/basic-data')
cy.openLeftMenu();
cy.get('.q-item > .q-item__label').should('have.text',' #1112')
cy.closeLeftMenu();
cy.clearSearchbar();
cy.writeSearchbar('1{enter}');
cy.openLeftMenu();
cy.get('.q-item > .q-item__label').should('have.text',' #1')
cy.closeLeftMenu();
});
});

21
test/cypress/support/commands.js
View File

@ -163,7 +163,28 @@ Cypress.Commands.add('openRightMenu', (element) => {
cy.get('#actions-append').click();
});
Cypress.Commands.add('openLeftMenu', (element) => {
if (element) cy.waitForElement(element);
cy.get('.q-toolbar > .q-btn--round.q-btn--dense > .q-btn__content > .q-icon').click();
});
Cypress.Commands.add('closeLeftMenu', (element) => {
if (element) cy.waitForElement(element);
cy.get('.fullscreen').click();
});
Cypress.Commands.add('clearSearchbar', (element) => {
if (element) cy.waitForElement(element);
cy.get('#searchbar > form > label > div:nth-child(1) input').clear();
});
Cypress.Commands.add('writeSearchbar', (value) => {
cy.get('#searchbar > form > label > div:nth-child(1) input').type(value);
});
Cypress.Commands.add('validateContent', (selector, expectedValue) => {
cy.get(selector).should('have.text', expectedValue);
});
Cypress.Commands.add('clickFilterSearchBtn', () => {
cy.get('.q-item__section > .q-btn > .q-btn__content > .q-icon').click();
});
// registerCommands();

2
test/vitest/__tests__/components/Paginate.spec.js
View File

@ -119,7 +119,7 @@ describe('VnPaginate', () => {
await vm.onLoad(index, done);
expect(vm.pagination.page).toEqual(2);
expect(done).toHaveBeenCalledWith(true);
expect(done).toHaveBeenCalledWith(false);
});
});
});

53
test/vitest/__tests__/components/common/VnSearchBar.spec.js Normal file
View File

@ -0,0 +1,53 @@
import { vi, describe, expect, it, beforeAll, beforeEach, afterEach } from 'vitest';
import { createWrapper, axios } from 'app/test/vitest/helper';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
describe('VnSearchBar', () => {
let vm;
let wrapper;
beforeAll(() => {
wrapper = createWrapper(VnSearchbar, {
propsData: {
dataKey: 'CustomerList',
label: 'Search customer',
info: 'Info customer',
},
});
vm = wrapper.vm;
vm.route.matched = [
{
path: '/',
},
{
path: '/customer',
},
{
path: '/customer/:id',
},
{
path: '/customer/:id/basic-data',
},
];
});
afterEach(() => {
vi.clearAllMocks();
});
it('should be defined', async () => {
expect(vm.searchText).toBeDefined();
expect(vm.searchText).toEqual('');
});
it('should redirect', async () => {
vi.spyOn(vm.router,'push');
vm.searchText = '1';
await vm.search();
expect(vm.router.push).toHaveBeenCalledWith('/customer/1/basic-data');
vm.searchText = '1112';
expect(vm.searchText).toEqual('1112');
vi.spyOn(vm.router,'push');
await vm.search();
expect(vm.router.push).toHaveBeenCalledWith('/customer/1112/basic-data');
});
});