Submodulos de suppliers: Accounts, Contacts y Addresses
This commit is contained in:
parent
473e96ffb4
commit
865a13aafa
|
|
@ -131,7 +131,7 @@ const onProvinceCreated = async () => {
|
|||
es:
|
||||
New postcode: Nuevo código postal
|
||||
Please, ensure you put the correct data!: ¡Por favor, asegúrese de poner los datos correctos!
|
||||
City: Ciudad
|
||||
City: Población
|
||||
Province: Provincia
|
||||
Country: País
|
||||
Postcode: Código postal
|
||||
|
|
|
|||
|
|
@ -921,6 +921,10 @@ export default {
|
|||
street: 'Street',
|
||||
postcode: 'Postcode',
|
||||
phone: 'Phone',
|
||||
name: 'Name',
|
||||
city: 'City',
|
||||
province: 'Province',
|
||||
mobile: 'Mobile',
|
||||
},
|
||||
},
|
||||
travel: {
|
||||
|
|
|
|||
|
|
@ -920,6 +920,10 @@ export default {
|
|||
street: 'Dirección',
|
||||
postcode: 'Código postal',
|
||||
phone: 'Teléfono',
|
||||
name: 'Nombre',
|
||||
city: 'Población',
|
||||
province: 'Provincia',
|
||||
mobile: 'Móvil',
|
||||
},
|
||||
},
|
||||
travel: {
|
||||
|
|
|
|||
|
|
@ -33,7 +33,15 @@ const addressesFilter = {
|
|||
};
|
||||
|
||||
const redirectToCreateView = () => {
|
||||
router.push({ name: 'SupplierCreate' });
|
||||
router.push({ name: 'SupplierAddressesCreate' });
|
||||
};
|
||||
|
||||
const redirectToUpdateView = (addressData) => {
|
||||
const stringifiedAddressData = JSON.stringify(addressData);
|
||||
router.push({
|
||||
name: 'SupplierAddressesCreate',
|
||||
query: { addressData: stringifiedAddressData },
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -52,7 +60,7 @@ const redirectToCreateView = () => {
|
|||
:key="row.id"
|
||||
:title="row.nickname"
|
||||
:id="row.id"
|
||||
@click="redirectToCreateView(row.id)"
|
||||
@click="redirectToUpdateView(row)"
|
||||
>
|
||||
<template #list-items>
|
||||
<VnLv
|
||||
|
|
|
|||
|
|
@ -0,0 +1,182 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { reactive, ref, onMounted, onBeforeMount } from 'vue';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnSelectCreate from 'src/components/common/VnSelectCreate.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import CustomerCreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const provincesOptions = ref([]);
|
||||
const postcodesOptions = ref([]);
|
||||
const townsLocationOptions = ref([]);
|
||||
const viewAction = ref();
|
||||
const updateAddressId = ref(null);
|
||||
const newAddressForm = reactive({
|
||||
nickname: null,
|
||||
street: null,
|
||||
postalCode: null,
|
||||
city: null,
|
||||
provinceFk: null,
|
||||
phone: null,
|
||||
mobile: null,
|
||||
});
|
||||
|
||||
const onDataSaved = () => {
|
||||
router.push({ name: 'SupplierAddresses' });
|
||||
};
|
||||
|
||||
const updateAddressForm = (addressData) => {
|
||||
for (let key in newAddressForm) {
|
||||
if (key in addressData) {
|
||||
newAddressForm[key] = addressData[key];
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
onBeforeMount(() => {
|
||||
viewAction.value = route.query.addressData ? 'update' : 'create';
|
||||
|
||||
if (viewAction.value === 'create') newAddressForm.supplierFk = route.params.id;
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
if (viewAction.value === 'update' && route.query.addressData) {
|
||||
const addressData = JSON.parse(route.query.addressData);
|
||||
updateAddressId.value = addressData.id;
|
||||
updateAddressForm(addressData);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
ref="postcodeFetchDataRef"
|
||||
url="Postcodes/location"
|
||||
@on-fetch="(data) => (postcodesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
ref="provincesFetchDataRef"
|
||||
@on-fetch="(data) => (provincesOptions = data)"
|
||||
auto-load
|
||||
url="Provinces"
|
||||
/>
|
||||
<FetchData
|
||||
ref="townsFetchDataRef"
|
||||
@on-fetch="(data) => (townsLocationOptions = data)"
|
||||
auto-load
|
||||
url="Towns/location"
|
||||
/>
|
||||
<QPage>
|
||||
<FormModel
|
||||
model="supplierAddresses"
|
||||
:form-initial-data="newAddressForm"
|
||||
:url-update="
|
||||
viewAction !== 'create' ? `SupplierAddresses/${updateAddressId}` : null
|
||||
"
|
||||
:url-create="viewAction === 'create' ? 'SupplierAddresses' : null"
|
||||
:observe-form-changes="viewAction === 'create'"
|
||||
@on-data-saved="onDataSaved()"
|
||||
>
|
||||
<template #form="{ data, validate }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.nickname"
|
||||
:label="t('supplier.addresses.name')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.street"
|
||||
:label="t('supplier.addresses.street')"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectCreate
|
||||
v-model="data.postalCode"
|
||||
:label="t('supplier.addresses.postcode')"
|
||||
:rules="validate('supplierAddress.postcode')"
|
||||
:roles-allowed-to-create="['deliveryAssistant']"
|
||||
:options="postcodesOptions"
|
||||
option-label="code"
|
||||
option-value="code"
|
||||
hide-selected
|
||||
>
|
||||
<template #form>
|
||||
<CustomerCreateNewPostcode
|
||||
@on-data-saved="onPostcodeCreated($event)"
|
||||
/>
|
||||
</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('supplier.addresses.city')"
|
||||
:options="townsLocationOptions"
|
||||
v-model="data.city"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('supplier.addresses.province')"
|
||||
:options="provincesOptions"
|
||||
hide-selected
|
||||
map-options
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.provinceFk"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.phone"
|
||||
:label="t('supplier.addresses.phone')"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.mobile"
|
||||
:label="t('supplier.addresses.mobile')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col" />
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</QPage>
|
||||
</template>
|
||||
|
|
@ -15,6 +15,7 @@ onMounted(() => {
|
|||
if (supplierContactRef.value) supplierContactRef.value.reload();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<CrudModel
|
||||
data-key="SupplierContact"
|
||||
|
|
|
|||
|
|
@ -134,6 +134,12 @@ export default {
|
|||
component: () =>
|
||||
import('src/pages/Supplier/Card/SupplierAddresses.vue'),
|
||||
},
|
||||
{
|
||||
path: 'address/create',
|
||||
name: 'SupplierAddressesCreate',
|
||||
component: () =>
|
||||
import('src/pages/Supplier/Card/SupplierAddressesCreate.vue'),
|
||||
},
|
||||
{
|
||||
path: 'consumption',
|
||||
name: 'SupplierConsumption',
|
||||
|
|
|
|||
Loading…
Reference in New Issue