Merge branch 'dev' into feature/order
This commit is contained in:
commit
42c8e8c80f
|
@ -61,7 +61,7 @@ const $props = defineProps({
|
|||
}
|
||||
});
|
||||
|
||||
const emit = defineEmits(['onFetch']);
|
||||
const emit = defineEmits(['onFetch', 'onDataSaved']);
|
||||
|
||||
defineExpose({
|
||||
save,
|
||||
|
@ -89,7 +89,7 @@ const isLoading = ref(false);
|
|||
// Si elegimos observar los cambios del form significa que inicialmente las actions estaran deshabilitadas
|
||||
const isResetting = ref(false);
|
||||
const hasChanges = ref(!$props.observeFormChanges);
|
||||
const originalData = ref({...$props.formInitialData});
|
||||
const originalData = ref({ ...$props.formInitialData });
|
||||
const formData = computed(() => state.get($props.model));
|
||||
const formUrl = computed(() => $props.url);
|
||||
|
||||
|
@ -122,7 +122,7 @@ async function fetch() {
|
|||
}
|
||||
|
||||
async function save() {
|
||||
if (!hasChanges.value) {
|
||||
if ($props.observeFormChanges && !hasChanges.value) {
|
||||
notify('globals.noChanges', 'negative');
|
||||
return;
|
||||
}
|
||||
|
@ -136,6 +136,7 @@ async function save() {
|
|||
} else {
|
||||
await axios.patch($props.urlUpdate || $props.url, body);
|
||||
}
|
||||
emit('onDataSaved', formData.value);
|
||||
} catch (err) {
|
||||
notify('errors.create', 'negative');
|
||||
}
|
||||
|
|
|
@ -0,0 +1,71 @@
|
|||
<script setup>
|
||||
import { ref, computed } from 'vue';
|
||||
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
|
||||
import { useRole } from 'src/composables/useRole';
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'update:options']);
|
||||
|
||||
const $props = defineProps({
|
||||
modelValue: {
|
||||
type: [String, Number, Object],
|
||||
default: null,
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
rolesAllowedToCreate: {
|
||||
type: Array,
|
||||
default: () => ['developer'],
|
||||
},
|
||||
});
|
||||
|
||||
const role = useRole();
|
||||
const showForm = ref(false);
|
||||
|
||||
const value = computed({
|
||||
get() {
|
||||
return $props.modelValue;
|
||||
},
|
||||
set(value) {
|
||||
emit('update:modelValue', value);
|
||||
},
|
||||
});
|
||||
|
||||
const isAllowedToCreate = computed(() => {
|
||||
return role.hasAny($props.rolesAllowedToCreate);
|
||||
});
|
||||
|
||||
const toggleForm = () => {
|
||||
showForm.value = !showForm.value;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<VnSelectFilter v-model="value" :options="options" v-bind="$attrs">
|
||||
<template v-if="isAllowedToCreate" #append>
|
||||
<QIcon
|
||||
@click.stop.prevent="toggleForm()"
|
||||
name="add"
|
||||
size="19px"
|
||||
class="add-icon"
|
||||
/>
|
||||
<QDialog v-model="showForm" transition-show="scale" transition-hide="scale">
|
||||
<slot name="form" />
|
||||
</QDialog>
|
||||
</template>
|
||||
<template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
|
||||
<slot :name="slotName" v-bind="slotData" :key="slotName" />
|
||||
</template>
|
||||
</VnSelectFilter>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.add-icon {
|
||||
cursor: pointer;
|
||||
background-color: $primary;
|
||||
border-radius: 50px;
|
||||
}
|
||||
</style>
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { ref, toRefs, watch, computed } from 'vue';
|
||||
import { ref, toRefs, computed } from 'vue';
|
||||
const emit = defineEmits(['update:modelValue', 'update:options']);
|
||||
|
||||
const $props = defineProps({
|
||||
|
@ -24,16 +24,11 @@ const $props = defineProps({
|
|||
default: true,
|
||||
},
|
||||
});
|
||||
const { optionLabel, options } = toRefs($props);
|
||||
const myOptions = ref([]);
|
||||
const myOptionsOriginal = ref([]);
|
||||
const vnSelectRef = ref(null);
|
||||
|
||||
function setOptions(data) {
|
||||
myOptions.value = JSON.parse(JSON.stringify(data));
|
||||
myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
|
||||
}
|
||||
setOptions(options.value);
|
||||
const { optionLabel } = toRefs($props);
|
||||
const myOptions = ref([]);
|
||||
const myOptionsOriginal = computed(() => $props.options);
|
||||
const vnSelectRef = ref(null);
|
||||
|
||||
const filter = (val, options) => {
|
||||
const search = val.toString().toLowerCase();
|
||||
|
@ -69,10 +64,6 @@ const filterHandler = (val, update) => {
|
|||
);
|
||||
};
|
||||
|
||||
watch(options, (newValue) => {
|
||||
setOptions(newValue);
|
||||
});
|
||||
|
||||
const value = computed({
|
||||
get() {
|
||||
return $props.modelValue;
|
||||
|
@ -105,8 +96,8 @@ const value = computed({
|
|||
size="18px"
|
||||
/>
|
||||
</template>
|
||||
<template v-for="(_, slotName) in $slots" #[slotName]="slotData">
|
||||
<slot :name="slotName" v-bind="slotData ?? {}" />
|
||||
<template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
|
||||
<slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
|
||||
</template>
|
||||
</QSelect>
|
||||
</template>
|
||||
|
|
|
@ -24,6 +24,13 @@ const props = defineProps({
|
|||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
unremovableParams: {
|
||||
type: Array,
|
||||
required: false,
|
||||
default: () => [],
|
||||
description:
|
||||
'Algunos filtros vienen con parametros de búsqueda por default y necesitan tener si o si un valor, por eso de ser necesario, esta prop nos sirve para saber que filtros podemos remover y cuales no',
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['refresh', 'clear', 'search']);
|
||||
|
@ -63,12 +70,25 @@ async function reload() {
|
|||
}
|
||||
|
||||
async function clearFilters() {
|
||||
userParams.value = {};
|
||||
isLoading.value = true;
|
||||
await arrayData.applyFilter({ params: {} });
|
||||
if (!props.showAll) store.data = [];
|
||||
isLoading.value = false;
|
||||
|
||||
// Filtrar los params no removibles
|
||||
const removableFilters = Object.keys(userParams.value).filter((param) =>
|
||||
props.unremovableParams.includes(param)
|
||||
);
|
||||
const newParams = {};
|
||||
// Conservar solo los params que no son removibles
|
||||
for (const key of removableFilters) {
|
||||
newParams[key] = userParams.value[key];
|
||||
}
|
||||
userParams.value = { ...newParams }; // Actualizar los params con los removibles
|
||||
await arrayData.applyFilter({ params: userParams.value });
|
||||
|
||||
if (!props.showAll) {
|
||||
store.data = [];
|
||||
}
|
||||
|
||||
isLoading.value = false;
|
||||
emit('clear');
|
||||
}
|
||||
|
||||
|
@ -156,7 +176,7 @@ function formatValue(value) {
|
|||
class="text-dark"
|
||||
color="primary"
|
||||
icon="label"
|
||||
removable
|
||||
:removable="!unremovableParams.includes(chip.label)"
|
||||
size="sm"
|
||||
v-for="chip of tags"
|
||||
>
|
||||
|
|
|
@ -132,6 +132,7 @@ export function useArrayData(key, userOptions) {
|
|||
|
||||
async function applyFilter({ filter, params }) {
|
||||
if (filter) store.userFilter = filter;
|
||||
store.filter = {};
|
||||
if (params) store.userParams = Object.assign({}, params);
|
||||
|
||||
await fetch({ append: false });
|
||||
|
@ -155,7 +156,9 @@ export function useArrayData(key, userOptions) {
|
|||
delete store.userParams[param];
|
||||
delete params[param];
|
||||
if (store.filter?.where) {
|
||||
delete store.filter.where[Object.keys(exprBuilder ? exprBuilder(param) : param)[0]];
|
||||
delete store.filter.where[
|
||||
Object.keys(exprBuilder ? exprBuilder(param) : param)[0]
|
||||
];
|
||||
if (Object.keys(store.filter.where).length === 0) {
|
||||
delete store.filter.where;
|
||||
}
|
||||
|
|
|
@ -763,6 +763,9 @@ export default {
|
|||
create: 'Create',
|
||||
summary: 'Summary',
|
||||
extraCommunity: 'Extra community',
|
||||
basicData: 'Basic data',
|
||||
history: 'History',
|
||||
thermographs: 'Termographs',
|
||||
},
|
||||
summary: {
|
||||
confirmed: 'Confirmed',
|
||||
|
|
|
@ -714,6 +714,9 @@ export default {
|
|||
create: 'Crear',
|
||||
summary: 'Resumen',
|
||||
extraCommunity: 'Extra comunitarios',
|
||||
basicData: 'Datos básicos',
|
||||
history: 'Historial',
|
||||
thermographs: 'Termógrafos',
|
||||
},
|
||||
summary: {
|
||||
confirmed: 'Confirmado',
|
||||
|
|
|
@ -0,0 +1,244 @@
|
|||
<script setup>
|
||||
import { reactive, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import CustomerCreateNewPostcode from './CustomerCreateNewPostcode.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';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const newClientForm = reactive({
|
||||
active: true,
|
||||
name: null,
|
||||
salesPersonFk: null,
|
||||
businessTypeFk: null,
|
||||
fi: null,
|
||||
socialName: null,
|
||||
street: null,
|
||||
postcode: null,
|
||||
city: null,
|
||||
provinceFk: null,
|
||||
countryFk: null,
|
||||
userName: null,
|
||||
email: null,
|
||||
isEqualizated: false,
|
||||
});
|
||||
|
||||
const workersOptions = ref([]);
|
||||
const businessTypesOptions = ref([]);
|
||||
const citiesLocationOptions = ref([]);
|
||||
const provincesLocationOptions = ref([]);
|
||||
const countriesOptions = ref([]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (workersOptions = data)"
|
||||
auto-load
|
||||
url="Workers/search?departmentCodes"
|
||||
/>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (businessTypesOptions = data)"
|
||||
auto-load
|
||||
url="BusinessTypes"
|
||||
/>
|
||||
<FetchData
|
||||
@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>
|
||||
<QToolbar class="bg-vn-dark">
|
||||
<div id="st-data"></div>
|
||||
<QSpace />
|
||||
<div id="st-actions"></div>
|
||||
</QToolbar>
|
||||
<FormModel
|
||||
:form-initial-data="newClientForm"
|
||||
:observe-form-changes="false"
|
||||
model="client"
|
||||
url-create="Clients/createWithUser"
|
||||
>
|
||||
<template #form="{ data, validate }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput :label="t('Comercial name')" v-model="data.name" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Salesperson')"
|
||||
:options="workersOptions"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.salesPersonFk"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Business type')"
|
||||
:options="businessTypesOptions"
|
||||
hide-selected
|
||||
option-label="description"
|
||||
option-value="code"
|
||||
v-model="data.businessTypeFk"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput v-model="data.fi" :label="t('Tax number')" />
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
:label="t('Business name')"
|
||||
:rules="validate('Client.socialName')"
|
||||
v-model="data.socialName"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
:label="t('Street')"
|
||||
:rules="validate('Client.street')"
|
||||
v-model="data.street"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput v-model="data.postcode" :label="t('Postcode')">
|
||||
<template #append>
|
||||
<QBtn
|
||||
class="cursor-pointer"
|
||||
color="primary"
|
||||
dense
|
||||
icon="add"
|
||||
round
|
||||
size="xs"
|
||||
>
|
||||
<QPopupProxy
|
||||
cover
|
||||
transition-hide="scale"
|
||||
transition-show="scale"
|
||||
>
|
||||
<CustomerCreateNewPostcode />
|
||||
</QPopupProxy>
|
||||
</QBtn>
|
||||
</template>
|
||||
</QInput>
|
||||
</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"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput v-model="data.userName" :label="t('Web user')" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput v-model="data.email" :label="t('Email')" />
|
||||
</div>
|
||||
</VnRow>
|
||||
<QCheckbox
|
||||
:label="t('Is equalizated')"
|
||||
v-model="newClientForm.isEqualizated"
|
||||
/>
|
||||
</template>
|
||||
</FormModel>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
grid-gap: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Comercial name: Nombre comercial
|
||||
Salesperson: Comercial
|
||||
Business type: Tipo de negocio
|
||||
Tax number: NIF / CIF
|
||||
Business name: Razón social
|
||||
Street: Dirección fiscal
|
||||
Postcode: Código postal
|
||||
City: Población
|
||||
Province: Provincia
|
||||
Country: País
|
||||
Web user: Usuario web
|
||||
Email: Email
|
||||
Is equalizated: Recargo de equivalencia
|
||||
</i18n>
|
|
@ -0,0 +1,143 @@
|
|||
<script setup>
|
||||
import { reactive, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import axios from 'axios';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import useNotify from 'src/composables/useNotify';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
|
||||
const { notify } = useNotify();
|
||||
const { t } = useI18n();
|
||||
|
||||
const data = reactive({
|
||||
city: null,
|
||||
code: null,
|
||||
countryFk: null,
|
||||
provinceFk: null,
|
||||
townFk: null,
|
||||
});
|
||||
|
||||
const countriesOptions = ref([]);
|
||||
const isLoading = ref(false);
|
||||
const provincesOptions = ref([]);
|
||||
const townsLocationOptions = ref([]);
|
||||
|
||||
async function save() {
|
||||
isLoading.value = true;
|
||||
|
||||
try {
|
||||
const { city, code, countryFk, provinceFk } = data;
|
||||
const payload = {
|
||||
city: city.name,
|
||||
code,
|
||||
countryFk,
|
||||
provinceFk,
|
||||
townFk: city.id,
|
||||
};
|
||||
|
||||
await axios.patch('/postcodes', payload);
|
||||
} catch (err) {
|
||||
notify('errors.create', 'negative');
|
||||
}
|
||||
|
||||
isLoading.value = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (townsLocationOptions = data)"
|
||||
auto-load
|
||||
url="Towns/location"
|
||||
/>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (provincesOptions = data)"
|
||||
auto-load
|
||||
url="Provinces"
|
||||
/>
|
||||
<FetchData
|
||||
@on-fetch="(data) => (countriesOptions = data)"
|
||||
auto-load
|
||||
url="Countries"
|
||||
/>
|
||||
<div class="q-pa-lg">
|
||||
<h6 class="q-my-xs">{{ t('New postcode') }}</h6>
|
||||
<p>{{ t('Please, ensure you put the correct data!') }}</p>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput label="Postcode" v-model="data.code" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('City')"
|
||||
:options="townsLocationOptions"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="city"
|
||||
v-model="data.city"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-xl">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Province')"
|
||||
:options="provincesOptions"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.provinceFk"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Country')"
|
||||
:options="countriesOptions"
|
||||
hide-selected
|
||||
option-label="country"
|
||||
option-value="id"
|
||||
v-model="data.countryFk"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<div class="flex justify-end">
|
||||
<QBtn
|
||||
:label="t('globals.cancel')"
|
||||
class="q-mr-lg"
|
||||
color="primary"
|
||||
outline
|
||||
v-close-popup
|
||||
/>
|
||||
<QBtn
|
||||
:label="t('globals.save')"
|
||||
@click="save"
|
||||
color="primary"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<QInnerLoading
|
||||
:showing="isLoading"
|
||||
:label="t('globals.pleaseWait')"
|
||||
color="primary"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
grid-gap: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
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
|
||||
Province: Provincia
|
||||
Country: País
|
||||
</i18n>
|
|
@ -28,25 +28,29 @@ function viewSummary(id) {
|
|||
},
|
||||
});
|
||||
}
|
||||
|
||||
const redirectToCreateView = () => {
|
||||
router.push({ name: 'CustomerCreate' });
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="CustomerList"
|
||||
:label="t('Search customer')"
|
||||
:info="t('You can search by customer id or name')"
|
||||
:label="t('Search customer')"
|
||||
data-key="CustomerList"
|
||||
/>
|
||||
</Teleport>
|
||||
<Teleport to="#actions-append">
|
||||
<div class="row q-gutter-x-sm">
|
||||
<QBtn
|
||||
flat
|
||||
@click="stateStore.toggleRightDrawer()"
|
||||
round
|
||||
dense
|
||||
flat
|
||||
icon="menu"
|
||||
round
|
||||
>
|
||||
<QTooltip bottom anchor="bottom right">
|
||||
{{ t('globals.collapseMenu') }}
|
||||
|
@ -55,7 +59,7 @@ function viewSummary(id) {
|
|||
</div>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QDrawer :width="256" show-if-above side="right" v-model="stateStore.rightDrawer">
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
<CustomerFilter data-key="CustomerList" />
|
||||
</QScrollArea>
|
||||
|
@ -63,18 +67,18 @@ function viewSummary(id) {
|
|||
<QPage class="column items-center q-pa-md">
|
||||
<div class="card-list">
|
||||
<VnPaginate
|
||||
data-key="CustomerList"
|
||||
url="/Clients/filter"
|
||||
order="id DESC"
|
||||
auto-load
|
||||
data-key="CustomerList"
|
||||
order="id DESC"
|
||||
url="/Clients/filter"
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<CardList
|
||||
v-for="row of rows"
|
||||
:id="row.id"
|
||||
:key="row.id"
|
||||
:title="row.name"
|
||||
:id="row.id"
|
||||
@click="navigate(row.id)"
|
||||
v-for="row of rows"
|
||||
>
|
||||
<template #list-items>
|
||||
<VnLv :label="t('customer.list.email')" :value="row.email" />
|
||||
|
@ -103,6 +107,12 @@ function viewSummary(id) {
|
|||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
<QPageSticky :offset="[20, 20]">
|
||||
<QBtn @click="redirectToCreateView()" color="primary" fab icon="add" />
|
||||
<QTooltip>
|
||||
{{ t('New client') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
|
@ -117,4 +127,5 @@ function viewSummary(id) {
|
|||
es:
|
||||
Search customer: Buscar cliente
|
||||
You can search by customer id or name: Puedes buscar por id o nombre del cliente
|
||||
New client: Nuevo cliente
|
||||
</i18n>
|
||||
|
|
|
@ -57,18 +57,6 @@ const getStatus = computed({
|
|||
},
|
||||
});
|
||||
|
||||
const onFetchCompanies = (companies) => {
|
||||
companiesOptions.value = [...companies];
|
||||
};
|
||||
|
||||
const onFetchPrinters = (printers) => {
|
||||
printersOptions.value = [...printers];
|
||||
};
|
||||
|
||||
const onFetchClients = (clients) => {
|
||||
clientsOptions.value = [...clients];
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
await invoiceOutGlobalStore.init();
|
||||
formData.value = { ...formInitialData.value };
|
||||
|
@ -76,9 +64,13 @@ onMounted(async () => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData url="Companies" @on-fetch="(data) => onFetchCompanies(data)" auto-load />
|
||||
<FetchData url="Printers" @on-fetch="(data) => onFetchPrinters(data)" auto-load />
|
||||
<FetchData url="Clients" @on-fetch="(data) => onFetchClients(data)" auto-load />
|
||||
<FetchData
|
||||
url="Companies"
|
||||
@on-fetch="(data) => (companiesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData url="Printers" @on-fetch="(data) => (printersOptions = data)" auto-load />
|
||||
<FetchData url="Clients" @on-fetch="(data) => (clientsOptions = data)" auto-load />
|
||||
|
||||
<QForm
|
||||
v-if="!initialDataLoading && optionsInitialData"
|
||||
|
|
|
@ -1,44 +1,54 @@
|
|||
<script setup>
|
||||
import { onMounted, ref, reactive } from 'vue';
|
||||
import { ref, computed, onBeforeMount } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { QCheckbox, QBtn } from 'quasar';
|
||||
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import InvoiceOutNegativeFilter from './InvoiceOutNegativeBasesFilter.vue';
|
||||
|
||||
import invoiceOutService from 'src/services/invoiceOut.service';
|
||||
import { toCurrency } from 'src/filters';
|
||||
import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js';
|
||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
|
||||
const invoiceOutGlobalStore = useInvoiceOutGlobalStore();
|
||||
|
||||
const rows = ref([]);
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
|
||||
const dateRange = reactive({
|
||||
from: Date.vnFirstDayOfMonth().toISOString(),
|
||||
to: Date.vnLastDayOfMonth().toISOString(),
|
||||
const arrayData = ref(null);
|
||||
|
||||
function exprBuilder(param, value) {
|
||||
switch (param) {
|
||||
case 'from':
|
||||
case 'to':
|
||||
return;
|
||||
default:
|
||||
return { [param]: value };
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeMount(async () => {
|
||||
const defaultParams = {
|
||||
from: Date.vnFirstDayOfMonth().toISOString(),
|
||||
to: Date.vnLastDayOfMonth().toISOString(),
|
||||
};
|
||||
arrayData.value = useArrayData('InvoiceOutNegative', {
|
||||
url: 'InvoiceOuts/negativeBases',
|
||||
limit: 0,
|
||||
userParams: defaultParams,
|
||||
exprBuilder: exprBuilder,
|
||||
});
|
||||
await arrayData.value.fetch({ append: false });
|
||||
|
||||
stateStore.rightDrawer = true;
|
||||
});
|
||||
|
||||
const rows = computed(() => arrayData.value.store.data);
|
||||
|
||||
const selectedCustomerId = ref(0);
|
||||
const selectedWorkerId = ref(0);
|
||||
|
||||
const filter = ref({
|
||||
company: null,
|
||||
country: null,
|
||||
clientId: null,
|
||||
client: null,
|
||||
amount: null,
|
||||
base: null,
|
||||
ticketId: null,
|
||||
active: null,
|
||||
hasToInvoice: null,
|
||||
verifiedData: null,
|
||||
comercial: null,
|
||||
});
|
||||
|
||||
const tableColumnComponents = {
|
||||
company: {
|
||||
component: 'span',
|
||||
|
@ -106,70 +116,70 @@ const tableColumnComponents = {
|
|||
},
|
||||
};
|
||||
|
||||
const columns = ref([
|
||||
const columns = computed(() => [
|
||||
{
|
||||
label: 'company',
|
||||
label: t('invoiceOut.negativeBases.company'),
|
||||
field: 'company',
|
||||
name: 'company',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'country',
|
||||
label: t('invoiceOut.negativeBases.country'),
|
||||
field: 'country',
|
||||
name: 'country',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'clientId',
|
||||
label: t('invoiceOut.negativeBases.clientId'),
|
||||
field: 'clientId',
|
||||
name: 'clientId',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'client',
|
||||
label: t('invoiceOut.negativeBases.client'),
|
||||
field: 'clientSocialName',
|
||||
name: 'client',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'amount',
|
||||
label: t('invoiceOut.negativeBases.amount'),
|
||||
field: 'amount',
|
||||
name: 'amount',
|
||||
align: 'left',
|
||||
format: (value) => toCurrency(value),
|
||||
},
|
||||
{
|
||||
label: 'base',
|
||||
label: t('invoiceOut.negativeBases.base'),
|
||||
field: 'taxableBase',
|
||||
name: 'base',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'ticketId',
|
||||
label: t('invoiceOut.negativeBases.ticketId'),
|
||||
field: 'ticketFk',
|
||||
name: 'ticketId',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'active',
|
||||
label: t('invoiceOut.negativeBases.active'),
|
||||
field: 'isActive',
|
||||
name: 'active',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'hasToInvoice',
|
||||
label: t('invoiceOut.negativeBases.hasToInvoice'),
|
||||
field: 'hasToInvoice',
|
||||
name: 'hasToInvoice',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'verifiedData',
|
||||
label: t('invoiceOut.negativeBases.verifiedData'),
|
||||
field: 'isTaxDataChecked',
|
||||
name: 'verifiedData',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: 'comercial',
|
||||
label: t('invoiceOut.negativeBases.comercial'),
|
||||
field: 'comercialName',
|
||||
name: 'comercial',
|
||||
align: 'left',
|
||||
|
@ -177,52 +187,10 @@ const columns = ref([
|
|||
]);
|
||||
|
||||
const downloadCSV = async () => {
|
||||
await invoiceOutGlobalStore.getNegativeBasesCsv(dateRange.from, dateRange.to);
|
||||
};
|
||||
|
||||
const search = async () => {
|
||||
const and = [];
|
||||
Object.keys(filter.value).forEach((key) => {
|
||||
if (filter.value[key]) {
|
||||
and.push({
|
||||
[key]: filter.value[key],
|
||||
});
|
||||
}
|
||||
});
|
||||
const searchFilter = {
|
||||
limit: 20,
|
||||
};
|
||||
|
||||
if (and.length) {
|
||||
searchFilter.where = {
|
||||
and,
|
||||
};
|
||||
}
|
||||
|
||||
const params = {
|
||||
...dateRange,
|
||||
filter: JSON.stringify(searchFilter),
|
||||
};
|
||||
rows.value = await invoiceOutService.getNegativeBases(params);
|
||||
};
|
||||
|
||||
const refresh = () => {
|
||||
dateRange.from = Date.vnFirstDayOfMonth().toISOString();
|
||||
dateRange.to = Date.vnLastDayOfMonth().toISOString();
|
||||
filter.value = {
|
||||
company: null,
|
||||
country: null,
|
||||
clientId: null,
|
||||
client: null,
|
||||
amount: null,
|
||||
base: null,
|
||||
ticketId: null,
|
||||
active: null,
|
||||
hasToInvoice: null,
|
||||
verifiedData: null,
|
||||
comercial: null,
|
||||
};
|
||||
search();
|
||||
await invoiceOutGlobalStore.getNegativeBasesCsv(
|
||||
arrayData.value.store.userParams.from,
|
||||
arrayData.value.store.userParams.to
|
||||
);
|
||||
};
|
||||
|
||||
const selectCustomerId = (id) => {
|
||||
|
@ -232,82 +200,33 @@ const selectCustomerId = (id) => {
|
|||
const selectWorkerId = (id) => {
|
||||
selectedWorkerId.value = id;
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
refresh();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()">
|
||||
<QBtn color="primary" icon-right="archive" no-caps @click="downloadCSV()" />
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
<InvoiceOutNegativeFilter data-key="InvoiceOutNegative" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QToolbar class="bg-vn-dark">
|
||||
<div id="st-data"></div>
|
||||
<QSpace />
|
||||
<div id="st-actions"></div>
|
||||
</QToolbar>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<QTable
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
hide-bottom
|
||||
row-key="clientId"
|
||||
:pagination="{ rowsPerPage: 0 }"
|
||||
class="full-width q-mt-md"
|
||||
>
|
||||
<template #top-left>
|
||||
<div class="row justify-start items-end">
|
||||
<VnInputDate
|
||||
v-model="dateRange.from"
|
||||
:label="t('invoiceOut.negativeBases.from')"
|
||||
class="q-mr-md"
|
||||
lazy-rules
|
||||
is-outlined
|
||||
/>
|
||||
<VnInputDate
|
||||
v-model="dateRange.to"
|
||||
:label="t('invoiceOut.negativeBases.to')"
|
||||
class="q-mr-md"
|
||||
lazy-rules
|
||||
is-outlined
|
||||
/>
|
||||
<QBtn
|
||||
color="primary"
|
||||
icon-right="archive"
|
||||
no-caps
|
||||
@click="downloadCSV()"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #top-right>
|
||||
<div class="row justify-start items-center">
|
||||
<span class="q-mr-md text-results">
|
||||
{{ rows.length }} {{ t('results') }}
|
||||
</span>
|
||||
<QBtn
|
||||
color="primary"
|
||||
icon-right="search"
|
||||
no-caps
|
||||
class="q-mr-sm"
|
||||
@click="search()"
|
||||
/>
|
||||
<QBtn color="primary" icon-right="refresh" no-caps @click="refresh" />
|
||||
</div>
|
||||
</template>
|
||||
<template #header="props">
|
||||
<QTr :props="props" class="full-height">
|
||||
<QTh v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<div class="column justify-start items-start full-height">
|
||||
{{ t(`invoiceOut.negativeBases.${col.label}`) }}
|
||||
<VnInput
|
||||
:class="{
|
||||
invisible:
|
||||
col.field === 'isActive' ||
|
||||
col.field === 'hasToInvoice' ||
|
||||
col.field === 'isTaxDataChecked',
|
||||
}"
|
||||
v-model="filter[col.field]"
|
||||
type="text"
|
||||
@keyup.enter="search()"
|
||||
is-outlined
|
||||
/>
|
||||
</div>
|
||||
</QTh>
|
||||
</QTr>
|
||||
</template>
|
||||
<template #body-cell="props">
|
||||
<QTd :props="props">
|
||||
<component
|
||||
|
@ -324,14 +243,8 @@ onMounted(async () => {
|
|||
"
|
||||
>{{ props.value }}
|
||||
</template>
|
||||
<CustomerDescriptorProxy
|
||||
v-if="props.col.name === 'clientId'"
|
||||
:id="selectedCustomerId"
|
||||
/>
|
||||
<WorkerDescriptorProxy
|
||||
v-if="props.col.name === 'comercial'"
|
||||
:id="selectedWorkerId"
|
||||
/>
|
||||
<CustomerDescriptorProxy :id="selectedCustomerId" />
|
||||
<WorkerDescriptorProxy :id="selectedWorkerId" />
|
||||
</component>
|
||||
</QTd>
|
||||
</template>
|
||||
|
@ -344,10 +257,6 @@ onMounted(async () => {
|
|||
border-radius: 4px;
|
||||
padding: 6px 6px 6px 6px;
|
||||
}
|
||||
|
||||
.text-results {
|
||||
color: var(--vn-label);
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n></i18n>
|
||||
|
|
|
@ -0,0 +1,134 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const props = defineProps({
|
||||
dataKey: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<VnFilterPanel
|
||||
:data-key="props.dataKey"
|
||||
:search-button="true"
|
||||
:unremovable-params="['from', 'to']"
|
||||
>
|
||||
<template #tags="{ tag, formatFn }">
|
||||
<div class="q-gutter-x-xs">
|
||||
<strong>{{ t(`params.${tag.label}`) }}: </strong>
|
||||
<span>{{ formatFn(tag.value) }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #body="{ params }">
|
||||
<QList dense class="q-gutter-y-sm q-mt-sm">
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate
|
||||
v-model="params.from"
|
||||
:label="t('invoiceOut.negativeBases.from')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate
|
||||
v-model="params.to"
|
||||
:label="t('invoiceOut.negativeBases.to')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
v-model="params.company"
|
||||
:label="t('invoiceOut.negativeBases.company')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
v-model="params.country"
|
||||
:label="t('invoiceOut.negativeBases.country')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
v-model="params.clientId"
|
||||
:label="t('invoiceOut.negativeBases.clientId')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
v-model="params.clientSocialName"
|
||||
:label="t('invoiceOut.negativeBases.client')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
v-model="params.amount"
|
||||
:label="t('invoiceOut.negativeBases.amount')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
v-model="params.comercialName"
|
||||
:label="t('invoiceOut.negativeBases.comercial')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</template>
|
||||
</VnFilterPanel>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
<i18n>
|
||||
en:
|
||||
params:
|
||||
from: From
|
||||
to: To
|
||||
company: Company
|
||||
country: Country
|
||||
clientId: Client Id
|
||||
clientSocialName: Client
|
||||
amount: Amount
|
||||
comercialName: Comercial
|
||||
es:
|
||||
params:
|
||||
from: Desde
|
||||
to: Hasta
|
||||
company: Empresa
|
||||
country: País
|
||||
clientId: Id cliente
|
||||
clientSocialName: Cliente
|
||||
amount: Importe
|
||||
comercialName: Comercial
|
||||
Date is required: La fecha es requerida
|
||||
|
||||
</i18n>
|
|
@ -1,12 +1,16 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import TravelDescriptor from './TravelDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<!-- Aca iría left menu y descriptor -->
|
||||
<TravelDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { reactive, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
|
@ -16,16 +16,10 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const filtersOptions = reactive({
|
||||
warehouses: [],
|
||||
continents: [],
|
||||
agencies: [],
|
||||
suppliers: [],
|
||||
});
|
||||
|
||||
const updateFilterOptions = (data, optionKey) => {
|
||||
filtersOptions[optionKey] = [...data];
|
||||
};
|
||||
const warehousesOptions = ref([]);
|
||||
const continentsOptions = ref([]);
|
||||
const agenciesOptions = ref([]);
|
||||
const suppliersOptions = ref([]);
|
||||
|
||||
const add = (paramsObj, key) => {
|
||||
if (paramsObj[key] === undefined) {
|
||||
|
@ -45,22 +39,22 @@ const decrement = (paramsObj, key) => {
|
|||
<template>
|
||||
<FetchData
|
||||
url="Warehouses"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'warehouses')"
|
||||
@on-fetch="(data) => (warehousesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Continents"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'continents')"
|
||||
@on-fetch="(data) => (continentsOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="AgencyModes"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'agencies')"
|
||||
@on-fetch="(data) => (agenciesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Suppliers"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'suppliers')"
|
||||
@on-fetch="(data) => (suppliersOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
|
||||
|
@ -123,7 +117,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.agencyModeFk')"
|
||||
v-model="params.agencyModeFk"
|
||||
:options="filtersOptions.agencies"
|
||||
:options="agenciesOptions"
|
||||
option-value="agencyFk"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -156,7 +150,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.warehouseOutFk')"
|
||||
v-model="params.warehouseOutFk"
|
||||
:options="filtersOptions.warehouses"
|
||||
:options="warehousesOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -171,7 +165,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.warehouseInFk')"
|
||||
v-model="params.warehouseInFk"
|
||||
:options="filtersOptions.warehouses"
|
||||
:options="warehousesOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -186,7 +180,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('supplier.pageTitles.supplier')"
|
||||
v-model="params.cargoSupplierFk"
|
||||
:options="filtersOptions.suppliers"
|
||||
:options="suppliersOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -201,7 +195,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.continent')"
|
||||
v-model="params.continent"
|
||||
:options="filtersOptions.continents"
|
||||
:options="continentsOptions"
|
||||
option-value="code"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
|
|
@ -24,8 +24,8 @@ const newTravelForm = reactive({
|
|||
});
|
||||
|
||||
const agenciesOptions = ref([]);
|
||||
const viewAction = ref();
|
||||
const warehousesOptions = ref([]);
|
||||
const viewAction = ref();
|
||||
|
||||
onBeforeMount(() => {
|
||||
// Esto nos permite decirle a FormModel si queremos observar los cambios o no
|
||||
|
@ -43,19 +43,19 @@ onBeforeMount(() => {
|
|||
}
|
||||
}
|
||||
});
|
||||
|
||||
const onFetchAgencies = (agencies) => {
|
||||
agenciesOptions.value = [...agencies];
|
||||
};
|
||||
|
||||
const onFetchWarehouses = (warehouses) => {
|
||||
warehousesOptions.value = [...warehouses];
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData url="AgencyModes" @on-fetch="(data) => onFetchAgencies(data)" auto-load />
|
||||
<FetchData url="Warehouses" @on-fetch="(data) => onFetchWarehouses(data)" auto-load />
|
||||
<FetchData
|
||||
url="AgencyModes"
|
||||
@on-fetch="(data) => (agenciesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Warehouses"
|
||||
@on-fetch="(data) => (warehousesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<QPage>
|
||||
<QToolbar class="bg-vn-dark">
|
||||
<div id="st-data"></div>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||
|
@ -17,15 +17,9 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const filtersOptions = reactive({
|
||||
warehouses: [],
|
||||
continents: [],
|
||||
agencies: [],
|
||||
});
|
||||
|
||||
const updateFilterOptions = (data, optionKey) => {
|
||||
filtersOptions[optionKey] = [...data];
|
||||
};
|
||||
const warehousesOptions = ref([]);
|
||||
const continentsOptions = ref([]);
|
||||
const agenciesOptions = ref([]);
|
||||
|
||||
const add = (paramsObj, key) => {
|
||||
if (paramsObj[key] === undefined) {
|
||||
|
@ -45,17 +39,17 @@ const decrement = (paramsObj, key) => {
|
|||
<template>
|
||||
<FetchData
|
||||
url="Warehouses"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'warehouses')"
|
||||
@on-fetch="(data) => (warehousesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Continents"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'continents')"
|
||||
@on-fetch="(data) => (continentsOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="AgencyModes"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'agencies')"
|
||||
@on-fetch="(data) => (agenciesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
|
||||
|
@ -82,7 +76,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.agencyModeFk')"
|
||||
v-model="params.agencyModeFk"
|
||||
:options="filtersOptions.agencies"
|
||||
:options="agenciesOptions"
|
||||
option-value="agencyFk"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -97,7 +91,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.warehouseOutFk')"
|
||||
v-model="params.warehouseOutFk"
|
||||
:options="filtersOptions.warehouses"
|
||||
:options="warehousesOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -112,7 +106,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.warehouseInFk')"
|
||||
v-model="params.warehouseInFk"
|
||||
:options="filtersOptions.warehouses"
|
||||
:options="warehousesOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
@ -223,7 +217,7 @@ const decrement = (paramsObj, key) => {
|
|||
<VnSelectFilter
|
||||
:label="t('params.continent')"
|
||||
v-model="params.continent"
|
||||
:options="filtersOptions.continents"
|
||||
:options="continentsOptions"
|
||||
option-value="code"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
|
|
|
@ -8,9 +8,9 @@ import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
|||
import CardList from 'src/components/ui/CardList.vue';
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import TravelSummaryDialog from './Card/TravelSummaryDialog.vue';
|
||||
import TravelFilter from './TravelFilter.vue';
|
||||
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import TravelFilter from './TravelFilter.vue';
|
||||
import { toDate } from 'src/filters/index';
|
||||
|
||||
const router = useRouter();
|
||||
|
|
|
@ -29,6 +29,14 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Customer/CustomerList.vue'),
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
name: 'CustomerCreate',
|
||||
meta: {
|
||||
title: 'create',
|
||||
},
|
||||
component: () => import('src/pages/Customer/CustomerCreate.vue'),
|
||||
},
|
||||
{
|
||||
path: 'payments',
|
||||
name: 'CustomerPayments',
|
||||
|
|
|
@ -11,7 +11,7 @@ export default {
|
|||
redirect: { name: 'TravelMain' },
|
||||
menus: {
|
||||
main: ['TravelList', 'ExtraCommunity'],
|
||||
card: [],
|
||||
card: ['TravelBasicData', 'TravelHistory', 'TravelThermographs'],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
|
@ -63,6 +63,36 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Travel/Card/TravelSummary.vue'),
|
||||
},
|
||||
{
|
||||
name: 'TravelBasicData',
|
||||
path: 'basic-data',
|
||||
meta: {
|
||||
title: 'basicData',
|
||||
icon: 'vn:settings',
|
||||
// roles: [],
|
||||
},
|
||||
// component: () => import(),
|
||||
},
|
||||
{
|
||||
name: 'TravelHistory',
|
||||
path: 'history',
|
||||
meta: {
|
||||
title: 'history',
|
||||
icon: 'history',
|
||||
// roles: [],
|
||||
},
|
||||
// component: () => import(),
|
||||
},
|
||||
{
|
||||
name: 'TravelThermographs',
|
||||
path: 'thermographs',
|
||||
meta: {
|
||||
title: 'thermographs',
|
||||
icon: 'vn:thermometer',
|
||||
// roles: [],
|
||||
},
|
||||
// component: () => import(),
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
|
|
|
@ -17,10 +17,6 @@ const request = async (method, url, params = {}) => {
|
|||
};
|
||||
|
||||
const invoiceOutService = {
|
||||
getNegativeBases: async (params) => {
|
||||
return await request('GET', 'InvoiceOuts/negativeBases', params);
|
||||
},
|
||||
|
||||
getNegativeBasesCsv: async (params) => {
|
||||
return await request('GET', 'InvoiceOuts/negativeBasesCsv', params);
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue