0
0
Fork 0

Merge pull request 'fix: duplicate call' (!775) from Fix-TicketSale into dev

Reviewed-on: verdnatura/salix-front#775
Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
Jon Elias 2024-10-01 09:54:30 +00:00
commit 21edf4b5d9
10 changed files with 130 additions and 75 deletions

View File

@ -1,35 +1,42 @@
<script setup>
import { reactive, ref } from 'vue';
import { onMounted, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnSelectProvince from 'components/VnSelectProvince.vue';
import VnInput from 'components/common/VnInput.vue';
import FormModelPopup from './FormModelPopup.vue';
const emit = defineEmits(['onDataSaved']);
const $props = defineProps({
countryFk: {
type: Number,
default: null,
},
provinceSelected: {
type: Number,
default: null,
},
provinces: {
type: Array,
default: () => [],
},
});
const { t } = useI18n();
const cityFormData = reactive({
const cityFormData = ref({
name: null,
provinceFk: null,
});
const provincesOptions = ref([]);
onMounted(() => {
cityFormData.value.provinceFk = $props.provinceSelected;
});
const onDataSaved = (...args) => {
emit('onDataSaved', ...args);
};
</script>
<template>
<FetchData
@on-fetch="(data) => (provincesOptions = data)"
auto-load
url="Provinces"
/>
<FormModelPopup
:title="t('New city')"
:subtitle="t('Please, ensure you put the correct data!')"
@ -41,11 +48,16 @@ const onDataSaved = (...args) => {
<template #form-inputs="{ data, validate }">
<VnRow>
<VnInput
:label="t('Name')"
:label="t('Names')"
v-model="data.name"
:rules="validate('city.name')"
/>
<VnSelectProvince v-model="data.provinceFk" />
<VnSelectProvince
:province-selected="$props.provinceSelected"
:country-fk="$props.countryFk"
v-model="data.provinceFk"
:provinces="$props.provinces"
/>
</VnRow>
</template>
</FormModelPopup>

View File

@ -63,17 +63,27 @@ function setTown(newTown, data) {
}
async function setProvince(id, data) {
await provincesFetchDataRef.value.fetch();
const newProvince = provincesOptions.value.find((province) => province.id == id);
if (!newProvince) return;
data.countryFk = newProvince.countryFk;
}
async function onProvinceCreated(data) {
await provincesFetchDataRef.value.fetch({
where: { countryFk: postcodeFormData.countryFk },
});
postcodeFormData.provinceFk.value = data.id;
}
watch(
() => [postcodeFormData.countryFk],
async (newCountryFk) => {
if (newCountryFk) {
async (newCountryFk, oldValueFk) => {
if (!!oldValueFk[0] && newCountryFk[0] !== oldValueFk[0]) {
postcodeFormData.provinceFk = null;
postcodeFormData.townFk = null;
}
if ((newCountryFk, newCountryFk !== postcodeFormData.countryFk)) {
await provincesFetchDataRef.value.fetch({
where: {
countryFk: newCountryFk[0],
@ -93,7 +103,7 @@ watch(
watch(
() => postcodeFormData.provinceFk,
async (newProvinceFk) => {
if (newProvinceFk) {
if (newProvinceFk[0] && newProvinceFk[0] !== postcodeFormData.provinceFk) {
await townsFetchDataRef.value.fetch({
where: { provinceFk: newProvinceFk[0] },
});
@ -140,10 +150,12 @@ async function handleCountries(data) {
:label="t('Postcode')"
v-model="data.code"
:rules="validate('postcode.code')"
clearable
/>
<VnSelectDialog
:label="t('City')"
@update:model-value="(value) => setTown(value, data)"
:tooltip="t('Create city')"
v-model="data.townFk"
:options="townsOptions"
option-label="name"
@ -151,7 +163,7 @@ async function handleCountries(data) {
:rules="validate('postcode.city')"
:acls="[{ model: 'Town', props: '*', accessType: 'WRITE' }]"
:emit-value="false"
clearable
:clearable="true"
>
<template #option="{ itemProps, opt }">
<QItem v-bind="itemProps">
@ -166,6 +178,9 @@ async function handleCountries(data) {
</template>
<template #form>
<CreateNewCityForm
:country-fk="data.countryFk"
:province-selected="data.provinceFk"
:provinces="provincesOptions"
@on-data-saved="
(_, requestResponse) =>
onCityCreated(requestResponse, data)
@ -176,9 +191,13 @@ async function handleCountries(data) {
</VnRow>
<VnRow>
<VnSelectProvince
:country-fk="postcodeFormData.countryFk"
:country-fk="data.countryFk"
:province-selected="data.provinceFk"
@update:model-value="(value) => setProvince(value, data)"
v-model="data.provinceFk"
:clearable="true"
:provinces="provincesOptions"
@on-province-created="onProvinceCreated"
/>
<VnSelect
:label="t('Country')"
@ -197,6 +216,7 @@ async function handleCountries(data) {
<i18n>
es:
New postcode: Nuevo código postal
Create city: Crear población
Please, ensure you put the correct data!: ¡Por favor, asegúrese de poner los datos correctos!
City: Población
Province: Provincia

View File

@ -16,7 +16,16 @@ const provinceFormData = reactive({
name: null,
autonomyFk: null,
});
const $props = defineProps({
countryFk: {
type: Number,
default: null,
},
provinces: {
type: Array,
default: () => [],
},
});
const autonomiesOptions = ref([]);
const onDataSaved = (dataSaved, requestResponse) => {
@ -31,6 +40,11 @@ const onDataSaved = (dataSaved, requestResponse) => {
<FetchData
@on-fetch="(data) => (autonomiesOptions = data)"
auto-load
:filter="{
where: {
countryFk: $props.countryFk,
},
}"
url="Autonomies/location"
/>
<FormModelPopup

View File

@ -8,18 +8,27 @@ import FetchData from 'components/FetchData.vue';
import CreateNewProvinceForm from './CreateNewProvinceForm.vue';
const emit = defineEmits(['onProvinceCreated']);
const provinceFk = defineModel({ type: Number });
watch(provinceFk, async () => await provincesFetchDataRef.value.fetch());
const $props = defineProps({
countryFk: {
type: Number,
default: null,
},
provinceSelected: {
type: Number,
default: null,
},
provinces: {
type: Array,
default: () => [],
},
});
const provinceFk = defineModel({ type: Number, default: null });
const { validate } = useValidator();
const { t } = useI18n();
const provincesOptions = ref();
const provincesOptions = ref($props.provinces);
provinceFk.value = $props.provinceSelected;
const provincesFetchDataRef = ref();
async function onProvinceCreated(_, data) {
@ -27,16 +36,6 @@ async function onProvinceCreated(_, data) {
provinceFk.value = data.id;
emit('onProvinceCreated', data);
}
watch(
() => $props.countryFk,
async (newProvinceFk) => {
if (newProvinceFk) {
await provincesFetchDataRef.value.fetch({
where: { countryFk: newProvinceFk },
});
}
}
);
async function handleProvinces(data) {
provincesOptions.value = data;
}
@ -45,14 +44,19 @@ async function handleProvinces(data) {
<template>
<FetchData
ref="provincesFetchDataRef"
:filter="{ include: { relation: 'country' } }"
:filter="{
include: { relation: 'country' },
where: {
countryFk: $props.countryFk,
},
}"
@on-fetch="handleProvinces"
auto-load
url="Provinces"
/>
<VnSelectDialog
:label="t('Province')"
:options="provincesOptions"
:options="$props.provinces"
:tooltip="t('Create province')"
hide-selected
v-model="provinceFk"
:rules="validate && validate('postcode.provinceFk')"
@ -67,11 +71,15 @@ async function handleProvinces(data) {
</QItem>
</template>
<template #form>
<CreateNewProvinceForm @on-data-saved="onProvinceCreated" />
<CreateNewProvinceForm
:country-fk="$props.countryFk"
@on-data-saved="onProvinceCreated"
/>
</template>
</VnSelectDialog>
</template>
<i18n>
es:
Province: Provincia
Create province: Crear provincia
</i18n>

View File

@ -140,12 +140,6 @@ const mixinRules = [
.q-field__control {
height: unset;
}
.q-field__control.relative-position.row.no-wrap
> .q-field__control-container
> input.q-field__native
~ div.q-field__label {
height: 41px;
}
.q-field--labeled {
.q-field__native,

View File

@ -73,6 +73,7 @@ const handleModelValue = (data) => {
v-bind="$attrs"
clearable
:emit-value="false"
:tooltip="t('Create new location')"
>
<template #form>
<CreateNewPostcode
@ -105,7 +106,9 @@ const handleModelValue = (data) => {
<i18n>
en:
search_by_postalcode: Search by postalcode, town, province or country
Create new location: Create new location
es:
Location: Ubicación
Create new location: Crear nueva ubicación
search_by_postalcode: Buscar por código postal, ciudad o país
</i18n>

View File

@ -53,7 +53,7 @@ const tableRef = ref([]);
watch(
() => route.params.id,
async () => await getSales()
() => tableRef.value.reload()
);
const columns = computed(() => [
@ -161,15 +161,6 @@ const onSalesFetched = (salesData) => {
for (let sale of salesData) sale.amount = getSaleTotal(sale);
};
const getSales = async () => {
try {
const { data } = await axios.get(`Tickets/${route.params.id}/getSales`);
onSalesFetched(data);
} catch (err) {
console.error('Error fetching sales', err);
}
};
const getSaleTotal = (sale) => {
if (sale.quantity == null || sale.price == null) return null;
@ -181,7 +172,7 @@ const getSaleTotal = (sale) => {
const resetChanges = async () => {
arrayData.fetch({ append: false });
getSales();
tableRef.value.reload();
};
const updateQuantity = async (sale) => {
@ -434,7 +425,6 @@ const setTransferParams = async () => {
onMounted(async () => {
stateStore.rightDrawer = true;
getConfig();
getSales();
getItems();
});
@ -623,6 +613,7 @@ watch(
:column-search="false"
:disable-option="{ card: true }"
auto-load
@on-fetch="onSalesFetched"
:create="{
onDataSaved: handleOnDataSave,
}"

View File

@ -44,23 +44,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
</script>
<template>
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
flat
@click="stateStore.toggleRightDrawer()"
round
dense
icon="dock_to_left"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
</template>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8">
<ZoneEventsPanel

View File

@ -1,7 +1,7 @@
<script setup>
import { onMounted, ref, computed, watch, onUnmounted } from 'vue';
import { useRoute } from 'vue-router';
import VnInput from 'src/components/common/VnInput.vue';
import { useState } from 'src/composables/useState';
import axios from 'axios';
import { useArrayData } from 'composables/useArrayData';
@ -144,7 +144,8 @@ watch(storeData, async (val) => {
});
const reFetch = async () => {
await arrayData.fetch({ append: false });
const { data } = await arrayData.fetch({ append: false });
nodes.value = data;
};
onMounted(async () => {
@ -182,6 +183,16 @@ onUnmounted(() => {
</script>
<template>
<VnInput
v-if="showSearchBar"
v-model="store.userParams.search"
:placeholder="$t('globals.search')"
@update:model-value="reFetch()"
>
<template #prepend>
<QBtn color="primary" icon="search" dense flat @click="reFetch()" />
</template>
</VnInput>
<QTree
ref="treeRef"
:nodes="nodes"

View File

@ -48,6 +48,25 @@ describe('VnLocation', () => {
`${createForm.prefix} > :nth-child(4) > .q-field:nth-child(3)> ${createForm.sufix}`
).should('have.length', 1);
});
it('should pass selected country', () => {
// Select a country
const country = 'Ecuador';
const province = 'Province five';
cy.selectOption(
`${createForm.prefix} > :nth-child(5) > .q-field:nth-child(5)> ${createForm.sufix}`,
country
);
cy.selectOption(
`${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix}`,
province
);
cy.get(
`${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix} > :nth-child(3) > .q-icon`
).click();
cy.get(
`#q-portal--dialog--4 > .q-dialog > ${createForm.prefix} > .vn-row > .q-select > ${createForm.sufix} > :nth-child(1) input`
).should('have.value', province);
});
});
describe('Worker Create', () => {
beforeEach(() => {