0
0
Fork 0
This commit is contained in:
Jorge Penadés 2024-11-25 13:37:34 +01:00
commit 34062d3fc4
18 changed files with 257 additions and 216 deletions

View File

@ -1,4 +1,7 @@
const { defineConfig } = require('cypress'); const { defineConfig } = require('cypress');
// https://docs.cypress.io/app/tooling/reporters
// https://docs.cypress.io/app/references/configuration
// https://www.npmjs.com/package/cypress-mochawesome-reporter
module.exports = defineConfig({ module.exports = defineConfig({
e2e: { e2e: {
@ -16,6 +19,7 @@ module.exports = defineConfig({
reporterOptions: { reporterOptions: {
charts: true, charts: true,
reportPageTitle: 'Cypress Inline Reporter', reportPageTitle: 'Cypress Inline Reporter',
reportFilename: '[status]_[datetime]-report',
embeddedScreenshots: true, embeddedScreenshots: true,
reportDir: 'test/cypress/reports', reportDir: 'test/cypress/reports',
inlineAssets: true, inlineAssets: true,

View File

@ -17,10 +17,6 @@ const $props = defineProps({
type: Number, type: Number,
default: null, default: null,
}, },
provinces: {
type: Array,
default: () => [],
},
}); });
const { t } = useI18n(); const { t } = useI18n();
@ -56,7 +52,6 @@ const onDataSaved = (...args) => {
:province-selected="$props.provinceSelected" :province-selected="$props.provinceSelected"
:country-fk="$props.countryFk" :country-fk="$props.countryFk"
v-model="data.provinceFk" v-model="data.provinceFk"
:provinces="$props.provinces"
/> />
</VnRow> </VnRow>
</template> </template>

View File

@ -56,10 +56,10 @@ async function onCityCreated(newTown, formData) {
} }
function setTown(newTown, data) { function setTown(newTown, data) {
if (!newTown) return;
town.value = newTown;
data.provinceFk = newTown.provinceFk; data.provinceFk = newTown.provinceFk;
data.countryFk = newTown.province.countryFk; data.countryFk = newTown.province.countryFk;
if (!newTown) return;
town.value = newTown;
} }
async function setProvince(id, data) { async function setProvince(id, data) {
@ -73,7 +73,7 @@ async function onProvinceCreated(data) {
await provincesFetchDataRef.value.fetch({ await provincesFetchDataRef.value.fetch({
where: { countryFk: postcodeFormData.countryFk }, where: { countryFk: postcodeFormData.countryFk },
}); });
postcodeFormData.provinceFk.value = data.id; postcodeFormData.provinceFk = data.id;
} }
watch( watch(
@ -90,22 +90,33 @@ watch(
postcodeFormData.townFk = null; postcodeFormData.townFk = null;
} }
if (oldValueFk !== newCountryFk) { if (oldValueFk !== newCountryFk) {
await provincesFetchDataRef.value.fetch({ await fetchProvinces(newCountryFk);
where: { await fetchTowns(newCountryFk);
countryFk: newCountryFk,
},
});
await townsFetchDataRef.value.fetch({
where: {
provinceFk: {
inq: provincesOptions.value.map(({ id }) => id),
},
},
});
} }
} }
); );
async function fetchTowns(countryFk) {
const townsFilter = countryFk
? {
where: {
provinceFk: {
inq: provincesOptions.value.map(({ id }) => id),
},
},
}
: {};
await townsFetchDataRef.value.fetch(townsFilter);
}
async function fetchProvinces(countryFk) {
const provincesFilter = countryFk
? {
where: {
countryFk: countryFk,
},
}
: {};
await provincesFetchDataRef.value.fetch(provincesFilter);
}
watch( watch(
() => postcodeFormData.provinceFk, () => postcodeFormData.provinceFk,
async (newProvinceFk, oldValueFk) => { async (newProvinceFk, oldValueFk) => {
@ -147,6 +158,13 @@ async function handleCountries(data) {
auto-load auto-load
url="Towns/location" url="Towns/location"
/> />
<FetchData
ref="CountriesFetchDataRef"
:sort-by="['name ASC']"
@on-fetch="handleCountries"
auto-load
url="Countries"
/>
<FormModelPopup <FormModelPopup
url-create="postcodes" url-create="postcodes"
@ -193,7 +211,6 @@ async function handleCountries(data) {
<CreateNewCityForm <CreateNewCityForm
:country-fk="data.countryFk" :country-fk="data.countryFk"
:province-selected="data.provinceFk" :province-selected="data.provinceFk"
:provinces="provincesOptions"
@on-data-saved=" @on-data-saved="
(_, requestResponse) => (_, requestResponse) =>
onCityCreated(requestResponse, data) onCityCreated(requestResponse, data)
@ -209,14 +226,12 @@ async function handleCountries(data) {
@update:model-value="(value) => setProvince(value, data)" @update:model-value="(value) => setProvince(value, data)"
v-model="data.provinceFk" v-model="data.provinceFk"
:clearable="true" :clearable="true"
:provinces="provincesOptions"
@on-province-created="onProvinceCreated" @on-province-created="onProvinceCreated"
/> />
<VnSelect <VnSelect
url="Countries"
:sort-by="['name ASC']"
:label="t('Country')" :label="t('Country')"
@update:options="handleCountries" @update:options="handleCountries"
:options="countriesOptions"
hide-selected hide-selected
option-label="name" option-label="name"
option-value="id" option-value="id"

View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { reactive, ref } from 'vue'; import { computed, reactive, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
@ -34,6 +34,12 @@ const onDataSaved = (dataSaved, requestResponse) => {
); );
emit('onDataSaved', dataSaved, requestResponse); emit('onDataSaved', dataSaved, requestResponse);
}; };
const where = computed(() => {
if (!$props.countryFk) {
return {};
}
return { countryFk: $props.countryFk };
});
</script> </script>
<template> <template>
@ -41,9 +47,7 @@ const onDataSaved = (dataSaved, requestResponse) => {
@on-fetch="(data) => (autonomiesOptions = data)" @on-fetch="(data) => (autonomiesOptions = data)"
auto-load auto-load
:filter="{ :filter="{
where: { where,
countryFk: $props.countryFk,
},
}" }"
url="Autonomies/location" url="Autonomies/location"
:sort-by="['name ASC']" :sort-by="['name ASC']"

View File

@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
const emit = defineEmits(['onSubmit']); const emit = defineEmits(['onSubmit']);
defineProps({ const $props = defineProps({
title: { title: {
type: String, type: String,
default: '', default: '',
@ -25,16 +25,21 @@ defineProps({
type: String, type: String,
default: '', default: '',
}, },
submitOnEnter: {
type: Boolean,
default: true,
},
}); });
const { t } = useI18n(); const { t } = useI18n();
const closeButton = ref(null); const closeButton = ref(null);
const isLoading = ref(false); const isLoading = ref(false);
const onSubmit = () => { const onSubmit = () => {
emit('onSubmit'); if ($props.submitOnEnter) {
closeForm(); emit('onSubmit');
closeForm();
}
}; };
const closeForm = () => { const closeForm = () => {

View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref, watch } from 'vue';
import { useValidator } from 'src/composables/useValidator'; import { useValidator } from 'src/composables/useValidator';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
@ -17,20 +17,23 @@ const $props = defineProps({
type: Number, type: Number,
default: null, default: null,
}, },
provinces: {
type: Array,
default: () => [],
},
}); });
const provinceFk = defineModel({ type: Number, default: null }); const provinceFk = defineModel({ type: Number, default: null });
const { validate } = useValidator(); const { validate } = useValidator();
const { t } = useI18n(); const { t } = useI18n();
const filter = ref({
include: { relation: 'country' },
where: {
countryFk: $props.countryFk,
},
});
const provincesOptions = ref($props.provinces); const provincesOptions = ref($props.provinces);
provinceFk.value = $props.provinceSelected;
const provincesFetchDataRef = ref(); const provincesFetchDataRef = ref();
provinceFk.value = $props.provinceSelected;
if (!$props.countryFk) {
filter.value.where = {};
}
async function onProvinceCreated(_, data) { async function onProvinceCreated(_, data) {
await provincesFetchDataRef.value.fetch({ where: { countryFk: $props.countryFk } }); await provincesFetchDataRef.value.fetch({ where: { countryFk: $props.countryFk } });
provinceFk.value = data.id; provinceFk.value = data.id;
@ -39,23 +42,29 @@ async function onProvinceCreated(_, data) {
async function handleProvinces(data) { async function handleProvinces(data) {
provincesOptions.value = data; provincesOptions.value = data;
} }
watch(
() => $props.countryFk,
async () => {
if ($props.countryFk) {
filter.value.where.countryFk = $props.countryFk;
} else filter.value.where = {};
await provincesFetchDataRef.value.fetch({});
}
);
</script> </script>
<template> <template>
<FetchData <FetchData
ref="provincesFetchDataRef" ref="provincesFetchDataRef"
:filter="{ :filter="filter"
include: { relation: 'country' },
where: {
countryFk: $props.countryFk,
},
}"
@on-fetch="handleProvinces" @on-fetch="handleProvinces"
url="Provinces" url="Provinces"
auto-load
/> />
<VnSelectDialog <VnSelectDialog
:label="t('Province')" :label="t('Province')"
:options="$props.provinces" :options="provincesOptions"
:tooltip="t('Create province')" :tooltip="t('Create province')"
hide-selected hide-selected
v-model="provinceFk" v-model="provinceFk"

View File

@ -57,27 +57,31 @@ async function getConfig(url, filter) {
} }
async function fetchViewConfigData() { async function fetchViewConfigData() {
const defaultFilter = { try {
where: { tableCode: $props.tableCode }, const defaultFilter = {
}; where: { tableCode: $props.tableCode },
};
const userConfig = await getConfig('UserConfigViews', { const userConfig = await getConfig('UserConfigViews', {
where: { where: {
...defaultFilter.where, ...defaultFilter.where,
...{ userFk: user.value.id }, ...{ userFk: user.value.id },
}, },
}); });
if (userConfig) { if (userConfig) {
initialUserConfigViewData.value = userConfig; initialUserConfigViewData.value = userConfig;
setUserConfigViewData(userConfig.configuration); setUserConfigViewData(userConfig.configuration);
return; return;
} }
const defaultConfig = await getConfig('DefaultViewConfigs', defaultFilter); const defaultConfig = await getConfig('DefaultViewConfigs', defaultFilter);
if (defaultConfig) { if (defaultConfig) {
setUserConfigViewData(defaultConfig.columns); setUserConfigViewData(defaultConfig.columns);
return; return;
}
} catch (err) {
console.error('Error fetching config view data', err);
} }
} }
@ -88,6 +92,7 @@ async function saveConfig() {
setUserConfigViewData(configuration, true); setUserConfigViewData(configuration, true);
if (!$props.tableCode) return popupProxyRef.value.hide(); if (!$props.tableCode) return popupProxyRef.value.hide();
try {
const params = {}; const params = {};
// Si existe una view config del usuario hacemos un update si no la creamos // Si existe una view config del usuario hacemos un update si no la creamos
if (initialUserConfigViewData.value) { if (initialUserConfigViewData.value) {
@ -118,7 +123,10 @@ async function saveConfig() {
} }
notify('globals.dataSaved', 'positive'); notify('globals.dataSaved', 'positive');
popupProxyRef.value.hide(); popupProxyRef.value.hide();
} catch (err) {
console.error('Error saving user view config', err);
notify('errors.writeRequest', 'negative');
}
} }
onMounted(async () => { onMounted(async () => {

View File

@ -74,6 +74,9 @@ const arrayData = useArrayData($props.dataKey, {
const route = useRoute(); const route = useRoute();
const store = arrayData.store; const store = arrayData.store;
const userParams = ref({}); const userParams = ref({});
defineExpose({ search, sanitizer, params: userParams });
onMounted(() => { onMounted(() => {
userParams.value = $props.modelValue ?? {}; userParams.value = $props.modelValue ?? {};
emit('init', { params: userParams.value }); emit('init', { params: userParams.value });
@ -197,7 +200,7 @@ const customTags = computed(() =>
async function remove(key) { async function remove(key) {
userParams.value[key] = undefined; userParams.value[key] = undefined;
search(); await search();
emit('remove', key); emit('remove', key);
emit('update:modelValue', userParams.value); emit('update:modelValue', userParams.value);
} }
@ -223,8 +226,6 @@ function sanitizer(params) {
} }
return params; return params;
} }
defineExpose({ search, sanitizer, userParams });
</script> </script>
<template> <template>

View File

@ -132,10 +132,24 @@ const addFilter = async (filter, params) => {
async function fetch(params) { async function fetch(params) {
useArrayData(props.dataKey, params); useArrayData(props.dataKey, params);
arrayData.reset(['filter.skip', 'skip']); arrayData.reset(['filter.skip', 'skip', 'page']);
await arrayData.fetch({ append: false }); await arrayData.fetch({ append: false });
if (!store.hasMoreData) isLoading.value = false; return emitStoreData();
}
async function update(params) {
useArrayData(props.dataKey, params);
const { limit, skip } = store;
store.limit = limit + skip;
store.skip = 0;
await arrayData.fetch({ append: false });
store.limit = limit;
store.skip = skip;
return emitStoreData();
}
function emitStoreData() {
if (!store.hasMoreData) isLoading.value = false;
emit('onFetch', store.data); emit('onFetch', store.data);
return store.data; return store.data;
} }
@ -181,7 +195,7 @@ async function onLoad(index, done) {
done(isDone); done(isDone);
} }
defineExpose({ fetch, addFilter, paginate }); defineExpose({ fetch, update, addFilter, paginate });
</script> </script>
<template> <template>

View File

@ -87,7 +87,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
const params = { filter }; const params = { filter };
Object.assign(params, userParams); Object.assign(params, userParams);
params.filter.skip = store.skip; if (params.filter) params.filter.skip = store.skip;
if (store?.order && typeof store?.order == 'string') store.order = [store.order]; if (store?.order && typeof store?.order == 'string') store.order = [store.order];
if (store.order?.length) params.filter.order = [...store.order]; if (store.order?.length) params.filter.order = [...store.order];
else delete params.filter.order; else delete params.filter.order;

View File

@ -95,6 +95,7 @@ const columns = computed(() => [
optionLabel: 'description', optionLabel: 'description',
}, },
}, },
orderBy: 'priority',
}, },
{ {
align: 'right', align: 'right',

View File

@ -350,7 +350,7 @@ const openTab = (id) =>
class="q-mr-sm" class="q-mr-sm"
dense dense
flat flat
@click="$refs.tableRef.reload()" @click="tableRef.CrudModelRef.vnPaginateRef.update()"
> >
<QTooltip>{{ $t('globals.refresh') }}</QTooltip> <QTooltip>{{ $t('globals.refresh') }}</QTooltip>
</QBtn> </QBtn>

View File

@ -1,14 +1,13 @@
<script setup> <script setup>
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import { onBeforeMount, onMounted, onUnmounted, ref, computed, watch } from 'vue'; import { onMounted, onUnmounted, ref, computed, watch } from 'vue';
import axios from 'axios'; import axios from 'axios';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CatalogItem from 'src/components/ui/CatalogItem.vue'; import CatalogItem from 'src/components/ui/CatalogItem.vue';
import OrderCatalogFilter from 'src/pages/Order/Card/OrderCatalogFilter.vue'; import OrderCatalogFilter from 'src/pages/Order/Card/OrderCatalogFilter.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import getParamWhere from 'src/filters/getParamWhere';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
const route = useRoute(); const route = useRoute();
@ -18,7 +17,6 @@ const { t } = useI18n();
const dataKey = 'OrderCatalogList'; const dataKey = 'OrderCatalogList';
const arrayData = useArrayData(dataKey); const arrayData = useArrayData(dataKey);
const store = arrayData.store; const store = arrayData.store;
const showFilter = ref(null);
const tags = ref([]); const tags = ref([]);
let catalogParams = { let catalogParams = {
@ -26,27 +24,6 @@ let catalogParams = {
orderBy: JSON.stringify({ field: 'relevancy DESC, name', way: 'ASC', isTag: false }), orderBy: JSON.stringify({ field: 'relevancy DESC, name', way: 'ASC', isTag: false }),
}; };
onBeforeMount(() => {
const whereParams = getParamWhere(route);
if (whereParams) {
const formattedWhereParams = {};
if (whereParams.and) {
whereParams.and.forEach((item) => {
Object.assign(formattedWhereParams, item);
});
} else {
Object.assign(formattedWhereParams, whereParams);
}
catalogParams = {
...catalogParams,
...formattedWhereParams,
};
} else {
showFilter.value = true;
}
});
onMounted(() => { onMounted(() => {
stateStore.rightDrawer = true; stateStore.rightDrawer = true;
checkOrderConfirmation(); checkOrderConfirmation();
@ -90,7 +67,7 @@ function extractValueTags(items) {
); );
tagValue.value = resultValueTags; tagValue.value = resultValueTags;
} }
const autoLoad = computed(() => !!catalogParams.categoryFk); const autoLoad = computed(() => !!JSON.parse(route?.query.table ?? '{}')?.categoryFk);
watch( watch(
() => store.data, () => store.data,
@ -112,7 +89,7 @@ watch(
:info="t('You can search items by name or id')" :info="t('You can search items by name or id')"
/> />
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea v-if="showFilter" class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<OrderCatalogFilter <OrderCatalogFilter
:data-key="dataKey" :data-key="dataKey"
:tag-value="tagValue" :tag-value="tagValue"
@ -128,8 +105,6 @@ watch(
url="Orders/CatalogFilter" url="Orders/CatalogFilter"
:limit="50" :limit="50"
:user-params="catalogParams" :user-params="catalogParams"
@on-fetch="showFilter = true"
:update-router="false"
:auto-load="autoLoad" :auto-load="autoLoad"
> >
<template #body="{ rows }"> <template #body="{ rows }">

View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { computed, ref, onMounted } from 'vue'; import { ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import axios from 'axios'; import axios from 'axios';
@ -8,7 +8,6 @@ import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelect from 'components/common/VnSelect.vue'; import VnSelect from 'components/common/VnSelect.vue';
import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue'; import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import getParamWhere from 'src/filters/getParamWhere';
import CatalogFilterValueDialog from 'src/pages/Order/Card/CatalogFilterValueDialog.vue'; import CatalogFilterValueDialog from 'src/pages/Order/Card/CatalogFilterValueDialog.vue';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
@ -32,11 +31,8 @@ const route = useRoute();
const arrayData = useArrayData(props.dataKey); const arrayData = useArrayData(props.dataKey);
const currentParams = ref({});
const categoryList = ref(null); const categoryList = ref(null);
const selectedCategoryFk = ref(null);
const typeList = ref([]); const typeList = ref([]);
const selectedTypeFk = ref(null);
const searchByTag = ref(null); const searchByTag = ref(null);
const vnFilterPanelRef = ref(); const vnFilterPanelRef = ref();
@ -53,50 +49,32 @@ const orderWayList = ref([
const orderBySelected = ref('relevancy DESC, name'); const orderBySelected = ref('relevancy DESC, name');
const orderWaySelected = ref('ASC'); const orderWaySelected = ref('ASC');
onMounted(() => {
selectedCategoryFk.value = getParamWhere(route, 'categoryFk');
selectedTypeFk.value = getParamWhere(route, 'typeFk');
});
const resetCategory = (params, search) => { const resetCategory = (params, search) => {
selectedCategoryFk.value = null;
typeList.value = null; typeList.value = null;
params.categoryFk = null; params.categoryFk = null;
params.typeFk = null; params.typeFk = null;
arrayData.store.userFilter = null; arrayData.store.userFilter = null;
removeTagGroupParam(search);
};
const selectCategory = (params, category, search) => {
if (params.categoryFk === category?.id) {
resetCategory(params, search);
return;
}
selectedCategoryFk.value = category?.id;
params.categoryFk = category?.id;
params.typeFk = null;
selectedTypeFk.value = null;
loadTypes(category?.id);
search(); search();
}; };
const loadTypes = async (categoryFk = selectedCategoryFk.value) => { const selectCategory = async (params, category, search) => {
if (vnFilterPanelRef.value.params.categoryFk === category?.id) {
resetCategory(params, search);
return;
}
params.typeFk = null;
params.categoryFk = category.id;
await loadTypes(category?.id);
await search();
};
const loadTypes = async (id) => {
const { data } = await axios.get(`Orders/${route.params.id}/getItemTypeAvailable`, { const { data } = await axios.get(`Orders/${route.params.id}/getItemTypeAvailable`, {
params: { itemCategoryId: categoryFk }, params: { itemCategoryId: id },
}); });
typeList.value = data; typeList.value = data;
}; };
const selectedCategory = computed(() => {
return (categoryList.value || []).find(
(category) => category?.id === selectedCategoryFk.value
);
});
const selectedType = computed(() => {
return (typeList.value || []).find((type) => type?.id === selectedTypeFk.value);
});
function exprBuilder(param, value) { function exprBuilder(param, value) {
switch (param) { switch (param) {
case 'categoryFk': case 'categoryFk':
@ -122,21 +100,21 @@ const applyTags = (tagInfo, params, search) => {
async function onSearchByTag(value) { async function onSearchByTag(value) {
if (!value.target.value) return; if (!value.target.value) return;
if (!currentParams.value?.tagGroups) { if (!vnFilterPanelRef.value.params?.tagGroups) {
currentParams.value.tagGroups = []; vnFilterPanelRef.value.params.tagGroups = [];
} }
currentParams.value.tagGroups.push({ vnFilterPanelRef.value.params.tagGroups.push({
values: [{ value: value.target.value }], values: [{ value: value.target.value }],
}); });
searchByTag.value = null; searchByTag.value = null;
} }
const removeTagGroupParam = (search, valIndex) => { const removeTagGroupParam = (params, search, valIndex) => {
if (!valIndex && valIndex !== 0) { if (!valIndex && valIndex !== 0) {
currentParams.value.tagGroups = null; params.tagGroups = null;
} else { } else {
currentParams.value.tagGroups.splice(valIndex, 1); params.tagGroups.splice(valIndex, 1);
} }
}; };
@ -148,7 +126,8 @@ const setCategoryList = (data) => {
icon: `vn:${(category.icon || '').split('-')[1]}`, icon: `vn:${(category.icon || '').split('-')[1]}`,
})); }));
selectedCategoryFk.value && loadTypes(); vnFilterPanelRef.value.params.categoryFk &&
loadTypes(vnFilterPanelRef.value.params.categoryFk);
}; };
const getCategoryClass = (category, params) => { const getCategoryClass = (category, params) => {
@ -157,12 +136,6 @@ const getCategoryClass = (category, params) => {
} }
}; };
const clearFilter = (key) => {
if (key === 'categoryFk') {
resetCategory();
}
};
function addOrder(value, field, params) { function addOrder(value, field, params) {
let { orderBy } = params; let { orderBy } = params;
orderBy = JSON.parse(orderBy); orderBy = JSON.parse(orderBy);
@ -170,11 +143,6 @@ function addOrder(value, field, params) {
params.orderBy = JSON.stringify(orderBy); params.orderBy = JSON.stringify(orderBy);
vnFilterPanelRef.value.search(); vnFilterPanelRef.value.search();
} }
onMounted(() => {
selectedCategoryFk.value = getParamWhere(route, 'categoryFk');
selectedTypeFk.value = getParamWhere(route, 'typeFk');
});
</script> </script>
<template> <template>
@ -182,24 +150,22 @@ onMounted(() => {
<VnFilterPanel <VnFilterPanel
ref="vnFilterPanelRef" ref="vnFilterPanelRef"
:data-key="props.dataKey" :data-key="props.dataKey"
:hidden-tags="['orderFk', 'orderBy']" :hidden-tags="['filter', 'orderFk', 'orderBy']"
:un-removable-params="['orderFk', 'orderBy']" :unremovable-params="['orderFk', 'orderBy']"
:expr-builder="exprBuilder" :expr-builder="exprBuilder"
:custom-tags="['tagGroups', 'categoryFk']" :custom-tags="['tagGroups', 'categoryFk']"
:redirect="false" :redirect="false"
@remove="clearFilter"
v-model="currentParams"
> >
<template #tags="{ tag, formatFn }"> <template #tags="{ tag, formatFn }">
<strong v-if="tag.label === 'typeFk'"> <strong v-if="tag.label === 'typeFk' && typeList">
{{ t(selectedType?.name || '') }} {{ t(typeList.find((t) => t.id == tag.value)?.name || '') }}
</strong> </strong>
<div v-else class="q-gutter-x-xs"> <div v-else class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong> <strong>{{ t(`params.${tag.label}`) }}: </strong>
<span>{{ formatFn(tag.value) }}</span> <span>{{ formatFn(tag.value) }}</span>
</div> </div>
</template> </template>
<template #customTags="{ tags: customTags, params, searchFn }"> <template #customTags="{ params, tags: customTags, searchFn }">
<template v-for="customTag in customTags" :key="customTag.label"> <template v-for="customTag in customTags" :key="customTag.label">
<VnFilterPanelChip <VnFilterPanelChip
v-for="(tag, valIndex) in Array.isArray(customTag.value) v-for="(tag, valIndex) in Array.isArray(customTag.value)
@ -210,11 +176,16 @@ onMounted(() => {
@remove=" @remove="
customTag.label === 'categoryFk' customTag.label === 'categoryFk'
? resetCategory(params, searchFn) ? resetCategory(params, searchFn)
: removeTagGroupParam(searchFn, valIndex) : removeTagGroupParam(params, searchFn, valIndex)
" "
> >
<strong v-if="customTag.label === 'categoryFk'"> <strong v-if="customTag.label === 'categoryFk' && categoryList">
{{ t(selectedCategory?.name || '') }} {{
t(
categoryList.find((c) => c.id == customTag.value)?.name ||
''
)
}}
</strong> </strong>
<strong v-if="tag?.tagSelection?.name" class="q-mr-xs"> <strong v-if="tag?.tagSelection?.name" class="q-mr-xs">
{{ tag.tagSelection.name }}: {{ tag.tagSelection.name }}:
@ -261,13 +232,8 @@ onMounted(() => {
emit-value emit-value
use-input use-input
sort-by="name ASC" sort-by="name ASC"
:disable="!selectedCategoryFk" :disable="!params.categoryFk"
@update:model-value=" @update:model-value="searchFn()"
(value) => {
selectedTypeFk = value;
searchFn();
}
"
> >
<template #option="{ itemProps, opt }"> <template #option="{ itemProps, opt }">
<QItem v-bind="itemProps"> <QItem v-bind="itemProps">
@ -337,7 +303,7 @@ onMounted(() => {
style="display: inline-block" style="display: inline-block"
:tags="tags" :tags="tags"
@apply-tags=" @apply-tags="
($event) => applyTags($event, currentParams, searchFn) ($event) => applyTags($event, params, searchFn)
" "
/> />
</QPopupProxy> </QPopupProxy>

View File

@ -43,7 +43,7 @@ const { t } = useI18n();
const { openConfirmationModal } = useVnConfirm(); const { openConfirmationModal } = useVnConfirm();
const isNew = computed(() => props.isNewMode); const isNew = computed(() => props.isNewMode);
const dated = ref(null); const dated = ref(props.date);
const tickedNodes = ref(); const tickedNodes = ref();
const _excludeType = ref('all'); const _excludeType = ref('all');
@ -73,7 +73,6 @@ const exclusionCreate = async () => {
await axios.post(`Zones/${route.params.id}/exclusions`, { await axios.post(`Zones/${route.params.id}/exclusions`, {
dated: dated.value, dated: dated.value,
}); });
await refetchEvents(); await refetchEvents();
}; };
@ -115,13 +114,14 @@ onMounted(() => {
@on-submit="onSubmit()" @on-submit="onSubmit()"
:default-cancel-button="false" :default-cancel-button="false"
:default-submit-button="false" :default-submit-button="false"
:submit-on-enter="false"
> >
<template #form-inputs> <template #form-inputs>
<VnRow class="row q-gutter-md q-mb-lg"> <VnRow class="row q-gutter-md q-mb-lg">
<VnInputDate <VnInputDate
:label="t('eventsInclusionForm.day')" :label="t('eventsInclusionForm.day')"
v-model="dated" v-model="dated"
:model-value="props.date" :required="true"
/> />
</VnRow> </VnRow>
<div class="column q-gutter-y-sm q-mb-md"> <div class="column q-gutter-y-sm q-mb-md">
@ -182,6 +182,7 @@ onMounted(() => {
:label="isNew ? t('globals.add') : t('globals.save')" :label="isNew ? t('globals.add') : t('globals.save')"
type="submit" type="submit"
color="primary" color="primary"
@click="onSubmit()"
/> />
</template> </template>
</FormPopup> </FormPopup>

View File

@ -38,6 +38,7 @@ const datakey = 'ZoneLocations';
const url = computed(() => `Zones/${route.params.id}/getLeaves`); const url = computed(() => `Zones/${route.params.id}/getLeaves`);
const arrayData = useArrayData(datakey, { const arrayData = useArrayData(datakey, {
url: url.value, url: url.value,
limit: null,
}); });
const store = arrayData.store; const store = arrayData.store;
@ -74,6 +75,7 @@ const onNodeExpanded = async (nodeKeysArray) => {
if (response.data) { if (response.data) {
node.childs = response.data.map((n) => { node.childs = response.data.map((n) => {
if (n.sons > 0) n.childs = [{}]; if (n.sons > 0) n.childs = [{}];
n.selected = isSelected(n.selected);
return n; return n;
}); });
} }
@ -90,21 +92,16 @@ const onNodeExpanded = async (nodeKeysArray) => {
previousExpandedNodes.value = nodeKeysSet; previousExpandedNodes.value = nodeKeysSet;
}; };
const formatNodeSelected = (node) => {
if (node.selected === 1) node.selected = true;
else if (node.selected === 0) node.selected = false;
if (node.sons > 0 && !node.childs) node.childs = [{}];
};
const fetchNodeLeaves = async (nodeKey) => { const fetchNodeLeaves = async (nodeKey) => {
if (!treeRef.value) return; if (!treeRef.value) return;
const node = treeRef.value?.getNodeByKey(nodeKey); const node = treeRef.value?.getNodeByKey(nodeKey);
if (node.selected === 1) node.selected = true; if (typeof node.selected === 'number') node.selected = !!node.selected;
else if (node.selected === 0) node.selected = false; if (node.sons > 0 && !node.childs) {
node.childs = [{}];
const index = expanded.value.indexOf(node.id);
expanded.value.splice(index, 1);
}
if (!node || node.sons === 0) return; if (!node || node.sons === 0) return;
state.set('Tree', node);
}; };
function getNodeIds(node) { function getNodeIds(node) {
@ -119,6 +116,10 @@ function getNodeIds(node) {
return ids; return ids;
} }
function isSelected(selected) {
if (typeof selected === 'number') return !!selected;
}
watch( watch(
() => store.data, () => store.data,
async (val) => { async (val) => {
@ -128,18 +129,9 @@ watch(
nodes.value[0].childs = [...val]; nodes.value[0].childs = [...val];
const fetchedNodeKeys = val.flatMap(getNodeIds); const fetchedNodeKeys = val.flatMap(getNodeIds);
state.set('Tree', [...fetchedNodeKeys]); state.set('Tree', [...fetchedNodeKeys]);
expanded.value = [null, ...fetchedNodeKeys];
if (!store.userParams?.search) { for (let n of state.get('Tree')) {
val.forEach((n) => { await fetchNodeLeaves(n);
formatNodeSelected(n);
});
store.data = null;
expanded.value = [null];
} else {
for (let n of state.get('Tree')) {
await fetchNodeLeaves(n);
}
expanded.value = [null, ...fetchedNodeKeys];
} }
previousExpandedNodes.value = new Set(expanded.value); previousExpandedNodes.value = new Set(expanded.value);
}, },
@ -147,13 +139,11 @@ watch(
); );
const reFetch = async () => { const reFetch = async () => {
const { data } = await arrayData.fetch({ append: false }); await arrayData.fetch({});
nodes.value = data;
expanded.value = [null];
}; };
onMounted(async () => { onMounted(async () => {
if (store.userParams?.search) await arrayData.fetch({}); await reFetch();
}); });
onUnmounted(() => { onUnmounted(() => {
@ -167,13 +157,13 @@ onUnmounted(() => {
v-if="showSearchBar" v-if="showSearchBar"
v-model="store.userParams.search" v-model="store.userParams.search"
:placeholder="$t('globals.search')" :placeholder="$t('globals.search')"
@update:model-value="reFetch()" @keydown.enter.stop.prevent="reFetch"
> >
<template #prepend> <template #prepend>
<QBtn color="primary" icon="search" dense flat @click="reFetch()" /> <QBtn color="primary" icon="search" dense flat @click="reFetch()" />
</template> </template>
</VnInput> </VnInput>
<VnSearchbar :data-key="datakey" :url="url" :redirect="false" /> <VnSearchbar v-if="!showSearchBar" :data-key="datakey" :url="url" :redirect="false" />
<QTree <QTree
ref="treeRef" ref="treeRef"
:nodes="nodes" :nodes="nodes"

View File

@ -99,7 +99,7 @@ describe('VnLocation', () => {
}); });
it('Create postCode', () => { it('Create postCode', () => {
const postCode = '1234475'; const postCode = Math.floor(100000 + Math.random() * 900000);
const province = 'Valencia'; const province = 'Valencia';
cy.get(createLocationButton).click(); cy.get(createLocationButton).click();
cy.get('.q-card > h1').should('have.text', 'New postcode'); cy.get('.q-card > h1').should('have.text', 'New postcode');
@ -115,20 +115,68 @@ describe('VnLocation', () => {
checkVnLocation(postCode, province); checkVnLocation(postCode, province);
}); });
it('Create city', () => {
const postCode = '9011'; it('Create city without country', () => {
const province = 'Saskatchew'; const cityName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click(); cy.get(createLocationButton).click();
cy.get(dialogInputs).eq(0).type(postCode);
cy.get( cy.get(
`${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix} > :nth-child(2) > .q-icon` `${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix} > :nth-child(2) > .q-icon`
).click(); ).click();
cy.selectOption('#q-portal--dialog--3 .q-select', 'one'); cy.selectOption('#q-portal--dialog--3 .q-select', 'one');
cy.get('#q-portal--dialog--3 .q-input').type(province); cy.get('#q-portal--dialog--3 .q-input').type(cityName);
cy.get('#q-portal--dialog--3 .q-btn--standard').click(); cy.get('#q-portal--dialog--3 .q-btn--standard').click();
cy.get('#q-portal--dialog--1 .q-btn--standard').click(); });
cy.waitForElement('.q-form');
checkVnLocation(postCode, province); it('Create province without country', () => {
const provinceName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.get(
`${createForm.prefix} > :nth-child(5) > .q-select > ${createForm.sufix} > :nth-child(2) `
)
.eq(0)
.click();
cy.selectOption('#q-portal--dialog--3 .q-select', 'one');
cy.countSelectOptions('#q-portal--dialog--3 .q-select', 4);
cy.get('#q-portal--dialog--3 .q-input').type(provinceName);
cy.get('#q-portal--dialog--3 .q-btn--standard').click();
});
it('Create city with country', () => {
const cityName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.selectOption(
`${createForm.prefix} > :nth-child(5) > :nth-child(3) `,
'Italia'
);
cy.get(
`${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix} > :nth-child(2) > .q-icon`
).click();
cy.selectOption('#q-portal--dialog--4 .q-select', 'Province four');
cy.countSelectOptions('#q-portal--dialog--4 .q-select', 1);
cy.get('#q-portal--dialog--4 .q-input').type(cityName);
cy.get('#q-portal--dialog--4 .q-btn--standard').click();
});
it('Create province with country', () => {
const provinceName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.selectOption(
`${createForm.prefix} > :nth-child(5) > :nth-child(3) `,
'España'
);
cy.get(
`${createForm.prefix} > :nth-child(5) > .q-select > ${createForm.sufix} > :nth-child(2) `
)
.eq(0)
.click();
cy.selectOption('#q-portal--dialog--4 .q-select', 'one');
cy.countSelectOptions('#q-portal--dialog--4 .q-select', 2);
cy.get('#q-portal--dialog--4 .q-input').type(provinceName);
cy.get('#q-portal--dialog--4 .q-btn--standard').click();
}); });
function checkVnLocation(postCode, province) { function checkVnLocation(postCode, province) {

View File

@ -91,6 +91,11 @@ Cypress.Commands.add('selectOption', (selector, option) => {
cy.get(selector).click(); cy.get(selector).click();
cy.get('.q-menu .q-item').contains(option).click(); cy.get('.q-menu .q-item').contains(option).click();
}); });
Cypress.Commands.add('countSelectOptions', (selector, option) => {
cy.waitForElement(selector);
cy.get(selector).click();
cy.get('.q-menu .q-item').should('have.length', option);
});
Cypress.Commands.add('fillInForm', (obj, form = '.q-form > .q-card') => { Cypress.Commands.add('fillInForm', (obj, form = '.q-form > .q-card') => {
cy.waitForElement('.q-form > .q-card'); cy.waitForElement('.q-form > .q-card');