forked from verdnatura/salix-front
refs #6768 location consignee create
This commit is contained in:
parent
64b2d8e169
commit
9673447792
|
|
@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
|
|||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import axios from 'axios';
|
||||
|
||||
import VnLocation from 'src/components/common/VnLocation.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
|
|
@ -20,13 +20,9 @@ const router = useRouter();
|
|||
|
||||
const formInitialData = reactive({ isDefaultAddress: false });
|
||||
|
||||
const townsFetchDataRef = ref(null);
|
||||
const postcodeFetchDataRef = ref(null);
|
||||
const urlCreate = ref('');
|
||||
|
||||
const postcodesOptions = ref([]);
|
||||
const citiesLocationOptions = ref([]);
|
||||
const provincesLocationOptions = ref([]);
|
||||
const agencyModes = ref([]);
|
||||
const incoterms = ref([]);
|
||||
const customsAgents = ref([]);
|
||||
|
|
@ -36,14 +32,6 @@ onBeforeMount(() => {
|
|||
getCustomsAgents();
|
||||
});
|
||||
|
||||
const onPostcodeCreated = async ({ code, provinceFk, townFk }, formData) => {
|
||||
await postcodeFetchDataRef.value.fetch();
|
||||
await townsFetchDataRef.value.fetch();
|
||||
formData.postalCode = code;
|
||||
formData.provinceFk = provinceFk;
|
||||
formData.city = citiesLocationOptions.value.find((town) => town.id === townFk).name;
|
||||
};
|
||||
|
||||
const getCustomsAgents = async () => {
|
||||
const { data } = await axios.get('CustomsAgents');
|
||||
customsAgents.value = data;
|
||||
|
|
@ -61,26 +49,18 @@ const toCustomerConsignees = () => {
|
|||
},
|
||||
});
|
||||
};
|
||||
function handleLocation(data, location) {
|
||||
const { town, code, provinceFk, countryFk } = location ?? {};
|
||||
data.postcode = code;
|
||||
data.city = town;
|
||||
data.provinceFk = provinceFk;
|
||||
data.countryFk = countryFk;
|
||||
console.log('data', data);
|
||||
}
|
||||
console.log('handleLocation: ', handleLocation);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (postcodesOptions = data)"
|
||||
auto-load
|
||||
ref="postcodeFetchDataRef"
|
||||
url="Postcodes/location"
|
||||
/>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (citiesLocationOptions = data)"
|
||||
auto-load
|
||||
ref="townsFetchDataRef"
|
||||
url="Towns/location"
|
||||
/>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (provincesLocationOptions = data)"
|
||||
auto-load
|
||||
url="Provinces/location"
|
||||
/>
|
||||
<fetch-data
|
||||
@on-fetch="(data) => (agencyModes = data)"
|
||||
auto-load
|
||||
|
|
@ -113,83 +93,17 @@ const toCustomerConsignees = () => {
|
|||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectDialog
|
||||
:label="t('Postcode')"
|
||||
:options="postcodesOptions"
|
||||
:roles-allowed-to-create="['deliveryAssistant']"
|
||||
<VnLocation
|
||||
:rules="validate('Worker.postcode')"
|
||||
hide-selected
|
||||
option-label="code"
|
||||
option-value="code"
|
||||
v-model="data.postalCode"
|
||||
>
|
||||
<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>
|
||||
</VnSelectDialog>
|
||||
</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>
|
||||
:roles-allowed-to-create="['deliveryAssistant']"
|
||||
:options="postcodesOptions"
|
||||
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('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('Agency')"
|
||||
|
|
|
|||
Loading…
Reference in New Issue