forked from verdnatura/salix-front
Fixes PR
This commit is contained in:
parent
aee4696bb2
commit
de8996d596
|
@ -1,11 +1,10 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { ref, computed } from 'vue';
|
import { ref, computed, onMounted } from 'vue';
|
||||||
|
|
||||||
import FetchData from 'components/FetchData.vue';
|
|
||||||
|
|
||||||
import { useState } from 'src/composables/useState';
|
import { useState } from 'src/composables/useState';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
import useNotify from 'src/composables/useNotify.js';
|
||||||
|
|
||||||
const $props = defineProps({
|
const $props = defineProps({
|
||||||
allColumns: {
|
allColumns: {
|
||||||
|
@ -24,17 +23,12 @@ const $props = defineProps({
|
||||||
|
|
||||||
const emit = defineEmits(['onConfigSaved']);
|
const emit = defineEmits(['onConfigSaved']);
|
||||||
|
|
||||||
|
const { notify } = useNotify();
|
||||||
const state = useState();
|
const state = useState();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const popupProxyRef = ref(null);
|
const popupProxyRef = ref(null);
|
||||||
const user = state.getUser();
|
const user = state.getUser();
|
||||||
const initialUserConfigViewData = ref(null);
|
const initialUserConfigViewData = ref(null);
|
||||||
const userConfigFilter = {
|
|
||||||
where: {
|
|
||||||
tableCode: $props.tableCode,
|
|
||||||
userFk: user.id,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
const formattedCols = ref([]);
|
const formattedCols = ref([]);
|
||||||
|
|
||||||
|
@ -43,16 +37,12 @@ const areAllChecksMarked = computed(() => {
|
||||||
});
|
});
|
||||||
|
|
||||||
const setUserConfigViewData = (data) => {
|
const setUserConfigViewData = (data) => {
|
||||||
initialUserConfigViewData.value = data;
|
if (!data) return;
|
||||||
if (data.length === 0) return;
|
|
||||||
formattedCols.value = $props.allColumns.map((col) => {
|
|
||||||
// Importante: El name de las columnas de la tabla debe conincidir con el name de las variables que devuelve la view config
|
// Importante: El name de las columnas de la tabla debe conincidir con el name de las variables que devuelve la view config
|
||||||
const obj = {
|
formattedCols.value = $props.allColumns.map((col) => ({
|
||||||
name: col,
|
name: col,
|
||||||
active: data[0].configuration[col],
|
active: data[col],
|
||||||
};
|
}));
|
||||||
return obj;
|
|
||||||
});
|
|
||||||
emitSavedConfig();
|
emitSavedConfig();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -60,40 +50,101 @@ const toggleMarkAll = (val) => {
|
||||||
formattedCols.value.forEach((col) => (col.active = val));
|
formattedCols.value.forEach((col) => (col.active = val));
|
||||||
};
|
};
|
||||||
|
|
||||||
const saveConfig = async () => {
|
const fetchViewConfigData = async () => {
|
||||||
try {
|
try {
|
||||||
const data = {
|
const userConfigFilter = {
|
||||||
id: initialUserConfigViewData.value[0].id,
|
where: {
|
||||||
userFk: 9,
|
|
||||||
tableCode: $props.tableCode,
|
tableCode: $props.tableCode,
|
||||||
configuration: {},
|
userFk: user.id,
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
formattedCols.value.forEach((col) => {
|
const userViewConfigResponse = await axios.get('UserConfigViews', {
|
||||||
data.configuration[col.name] = col.active;
|
params: { filter: userConfigFilter },
|
||||||
});
|
});
|
||||||
|
|
||||||
await axios.patch('UserConfigViews', data);
|
if (userViewConfigResponse.data && userViewConfigResponse.data.length > 0) {
|
||||||
|
initialUserConfigViewData.value = userViewConfigResponse.data[0];
|
||||||
|
setUserConfigViewData(userViewConfigResponse.data[0].configuration);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const defaultConfigFilter = {
|
||||||
|
where: {
|
||||||
|
tableCode: $props.tableCode,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const defaultViewConfigResponse = await axios.get('DefaultViewConfigs', {
|
||||||
|
params: { filter: defaultConfigFilter },
|
||||||
|
});
|
||||||
|
|
||||||
|
if (defaultViewConfigResponse.data && defaultViewConfigResponse.data.length > 0) {
|
||||||
|
setUserConfigViewData(defaultViewConfigResponse.data[0].columns);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.err('Error fetching config view data');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const saveConfig = async () => {
|
||||||
|
try {
|
||||||
|
const params = {};
|
||||||
|
const configuration = {};
|
||||||
|
|
||||||
|
formattedCols.value.forEach((col) => {
|
||||||
|
const { name, active } = col;
|
||||||
|
configuration[name] = active;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Si existe una view config del usuario hacemos un update si no la creamos
|
||||||
|
if (initialUserConfigViewData.value) {
|
||||||
|
params.updates = [
|
||||||
|
{
|
||||||
|
data: {
|
||||||
|
configuration: configuration,
|
||||||
|
},
|
||||||
|
where: {
|
||||||
|
id: initialUserConfigViewData.value.id,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
} else {
|
||||||
|
params.creates = [
|
||||||
|
{
|
||||||
|
userFk: user.value.id,
|
||||||
|
tableCode: $props.tableCode,
|
||||||
|
tableConfig: $props.tableCode,
|
||||||
|
configuration: configuration,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
const response = await axios.post('UserConfigViews/crud', params);
|
||||||
|
if (response.data && response.data[0]) {
|
||||||
|
initialUserConfigViewData.value = response.data[0];
|
||||||
|
}
|
||||||
emitSavedConfig();
|
emitSavedConfig();
|
||||||
|
notify('globals.dataSaved', 'positive');
|
||||||
|
|
||||||
popupProxyRef.value.hide();
|
popupProxyRef.value.hide();
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Error saving user view config');
|
console.error('Error saving user view config');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const emitSavedConfig = () => {
|
const emitSavedConfig = () => {
|
||||||
const filteredCols = formattedCols.value.filter((col) => col.active);
|
const filteredCols = formattedCols.value.filter((col) => col.active);
|
||||||
const mappedCols = filteredCols.map((col) => col.name);
|
const mappedCols = filteredCols.map((col) => col.name);
|
||||||
emit('onConfigSaved', mappedCols);
|
emit('onConfigSaved', mappedCols);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
await fetchViewConfigData();
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<fetch-data
|
|
||||||
v-if="user"
|
|
||||||
url="UserConfigViews"
|
|
||||||
:filter="userConfigFilter"
|
|
||||||
@on-fetch="(data) => setUserConfigViewData(data)"
|
|
||||||
auto-load
|
|
||||||
/>
|
|
||||||
<QBtn color="primary" icon="view_column">
|
<QBtn color="primary" icon="view_column">
|
||||||
<QPopupProxy ref="popupProxyRef">
|
<QPopupProxy ref="popupProxyRef">
|
||||||
<QCard class="column q-pa-md">
|
<QCard class="column q-pa-md">
|
||||||
|
@ -108,7 +159,7 @@ const emitSavedConfig = () => {
|
||||||
class="q-mb-sm"
|
class="q-mb-sm"
|
||||||
/>
|
/>
|
||||||
<div
|
<div
|
||||||
v-if="allColumns.length !== 0 && formattedCols.length !== 0"
|
v-if="allColumns.length > 0 && formattedCols.length > 0"
|
||||||
class="checks-layout"
|
class="checks-layout"
|
||||||
>
|
>
|
||||||
<QCheckbox
|
<QCheckbox
|
||||||
|
|
|
@ -12,6 +12,14 @@ const $props = defineProps({
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
|
label: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
required: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const value = computed({
|
const value = computed({
|
||||||
|
@ -39,6 +47,7 @@ const styleAttrs = computed(() => {
|
||||||
ref="vnInputRef"
|
ref="vnInputRef"
|
||||||
v-model="value"
|
v-model="value"
|
||||||
v-bind="{ ...$attrs, ...styleAttrs }"
|
v-bind="{ ...$attrs, ...styleAttrs }"
|
||||||
|
:label="required ? label + ' *' : label"
|
||||||
type="text"
|
type="text"
|
||||||
>
|
>
|
||||||
<template v-if="$slots.prepend" #prepend>
|
<template v-if="$slots.prepend" #prepend>
|
||||||
|
|
|
@ -20,6 +20,14 @@ const $props = defineProps({
|
||||||
type: Array,
|
type: Array,
|
||||||
default: () => ['developer'],
|
default: () => ['developer'],
|
||||||
},
|
},
|
||||||
|
label: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
required: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const role = useRole();
|
const role = useRole();
|
||||||
|
@ -44,7 +52,13 @@ const toggleForm = () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<VnSelectFilter v-model="value" :options="options" v-bind="$attrs">
|
<VnSelectFilter
|
||||||
|
v-model="value"
|
||||||
|
:options="options"
|
||||||
|
:label="label"
|
||||||
|
:required="required"
|
||||||
|
v-bind="$attrs"
|
||||||
|
>
|
||||||
<template v-if="isAllowedToCreate" #append>
|
<template v-if="isAllowedToCreate" #append>
|
||||||
<QIcon
|
<QIcon
|
||||||
@click.stop.prevent="toggleForm()"
|
@click.stop.prevent="toggleForm()"
|
||||||
|
|
|
@ -23,6 +23,14 @@ const $props = defineProps({
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true,
|
||||||
},
|
},
|
||||||
|
label: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
required: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const { optionLabel } = toRefs($props);
|
const { optionLabel } = toRefs($props);
|
||||||
|
@ -87,6 +95,7 @@ const value = computed({
|
||||||
hide-selected
|
hide-selected
|
||||||
fill-input
|
fill-input
|
||||||
ref="vnSelectRef"
|
ref="vnSelectRef"
|
||||||
|
:label="required ? label + ' *' : label"
|
||||||
>
|
>
|
||||||
<template v-if="isClearable" #append>
|
<template v-if="isClearable" #append>
|
||||||
<QIcon
|
<QIcon
|
||||||
|
|
|
@ -53,6 +53,7 @@ const fetchNodeLeaves = async (nodeKey) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const removeNode = (node) => {
|
const removeNode = (node) => {
|
||||||
|
const { id, parentFk } = node;
|
||||||
quasar
|
quasar
|
||||||
.dialog({
|
.dialog({
|
||||||
title: t('Are you sure you want to delete it?'),
|
title: t('Are you sure you want to delete it?'),
|
||||||
|
@ -65,9 +66,9 @@ const removeNode = (node) => {
|
||||||
})
|
})
|
||||||
.onOk(async () => {
|
.onOk(async () => {
|
||||||
try {
|
try {
|
||||||
await axios.post(`/Departments/${node.id}/removeChild`, node.id);
|
await axios.post(`/Departments/${id}/removeChild`, id);
|
||||||
notify('department.departmentRemoved', 'positive');
|
notify(t('department.departmentRemoved'), 'positive');
|
||||||
await fetchNodeLeaves(node.parentFk);
|
await fetchNodeLeaves(parentFk);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.log('Error removing department');
|
console.log('Error removing department');
|
||||||
}
|
}
|
||||||
|
@ -85,7 +86,7 @@ const onNodeCreated = async () => {
|
||||||
|
|
||||||
const redirectToDepartmentSummary = (id) => {
|
const redirectToDepartmentSummary = (id) => {
|
||||||
if (!id) return;
|
if (!id) return;
|
||||||
router.push({ name: 'DepartmentSummary', params: { id: id } });
|
router.push({ name: 'DepartmentSummary', params: { id } });
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,8 @@
|
||||||
|
export default function dateRange(value) {
|
||||||
|
const minHour = new Date(value);
|
||||||
|
minHour.setHours(0, 0, 0, 0);
|
||||||
|
const maxHour = new Date(value);
|
||||||
|
maxHour.setHours(23, 59, 59, 59);
|
||||||
|
|
||||||
|
return [minHour, maxHour];
|
||||||
|
}
|
|
@ -7,6 +7,7 @@ import toCurrency from './toCurrency';
|
||||||
import toPercentage from './toPercentage';
|
import toPercentage from './toPercentage';
|
||||||
import toLowerCamel from './toLowerCamel';
|
import toLowerCamel from './toLowerCamel';
|
||||||
import dashIfEmpty from './dashIfEmpty';
|
import dashIfEmpty from './dashIfEmpty';
|
||||||
|
import dateRange from './dateRange';
|
||||||
|
|
||||||
export {
|
export {
|
||||||
toLowerCase,
|
toLowerCase,
|
||||||
|
@ -18,4 +19,5 @@ export {
|
||||||
toCurrency,
|
toCurrency,
|
||||||
toPercentage,
|
toPercentage,
|
||||||
dashIfEmpty,
|
dashIfEmpty,
|
||||||
|
dateRange,
|
||||||
};
|
};
|
||||||
|
|
|
@ -7,6 +7,7 @@ import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||||
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||||
|
import { dateRange } from 'src/filters';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
dataKey: {
|
dataKey: {
|
||||||
|
@ -32,6 +33,48 @@ const sageTransactionTypesOptions = ref([]);
|
||||||
|
|
||||||
const visibleColumnsSet = computed(() => new Set(props.visibleColumns));
|
const visibleColumnsSet = computed(() => new Set(props.visibleColumns));
|
||||||
|
|
||||||
|
const exprBuilder = (param, value) => {
|
||||||
|
switch (param) {
|
||||||
|
case 'created':
|
||||||
|
return {
|
||||||
|
'c.created': {
|
||||||
|
between: dateRange(value),
|
||||||
|
},
|
||||||
|
};
|
||||||
|
case 'id':
|
||||||
|
case 'name':
|
||||||
|
case 'socialName':
|
||||||
|
case 'fi':
|
||||||
|
case 'credit':
|
||||||
|
case 'creditInsurance':
|
||||||
|
case 'phone':
|
||||||
|
case 'mobile':
|
||||||
|
case 'street':
|
||||||
|
case 'city':
|
||||||
|
case 'postcode':
|
||||||
|
case 'email':
|
||||||
|
case 'isActive':
|
||||||
|
case 'isVies':
|
||||||
|
case 'isTaxDataChecked':
|
||||||
|
case 'isEqualizated':
|
||||||
|
case 'isFreezed':
|
||||||
|
case 'hasToInvoice':
|
||||||
|
case 'hasToInvoiceByAddress':
|
||||||
|
case 'isToBeMailed':
|
||||||
|
case 'hasSepaVnl':
|
||||||
|
case 'hasLcr':
|
||||||
|
case 'hasCoreVnl':
|
||||||
|
case 'countryFk':
|
||||||
|
case 'provinceFk':
|
||||||
|
case 'salesPersonFk':
|
||||||
|
case 'businessTypeFk':
|
||||||
|
case 'payMethodFk':
|
||||||
|
case 'sageTaxTypeFk':
|
||||||
|
case 'sageTransactionTypeFk':
|
||||||
|
return { [`c.${param}`]: value };
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const shouldRenderColumn = (colName) => {
|
const shouldRenderColumn = (colName) => {
|
||||||
return visibleColumnsSet.value.has(colName);
|
return visibleColumnsSet.value.has(colName);
|
||||||
};
|
};
|
||||||
|
@ -88,7 +131,11 @@ const shouldRenderColumn = (colName) => {
|
||||||
auto-load
|
auto-load
|
||||||
@on-fetch="(data) => (sageTransactionTypesOptions = data)"
|
@on-fetch="(data) => (sageTransactionTypesOptions = data)"
|
||||||
/>
|
/>
|
||||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
<VnFilterPanel
|
||||||
|
:data-key="props.dataKey"
|
||||||
|
:search-button="true"
|
||||||
|
:expr-builder="exprBuilder"
|
||||||
|
>
|
||||||
<template #tags="{ tag, formatFn }">
|
<template #tags="{ tag, formatFn }">
|
||||||
<div class="q-gutter-x-xs">
|
<div class="q-gutter-x-xs">
|
||||||
<strong
|
<strong
|
||||||
|
@ -565,12 +612,6 @@ const shouldRenderColumn = (colName) => {
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<i18n>
|
<i18n>
|
||||||
<<<<<<< HEAD:src/pages/Customer/ExtendedList/CustomerExtendedListFilter.vue
|
|
||||||
es:
|
es:
|
||||||
Identifier: Identificador
|
|
||||||
=======
|
|
||||||
|
|
||||||
es:
|
|
||||||
>>>>>>> dev:src/pages/Customer/CustomerExtendedListFilter.vue
|
|
||||||
Social name: Razón social
|
Social name: Razón social
|
||||||
</i18n>
|
</i18n>
|
||||||
|
|
|
@ -60,13 +60,14 @@ const companiesOptions = ref([]);
|
||||||
<template #form="{ data, validate }">
|
<template #form="{ data, validate }">
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
<VnSelectFilter
|
<VnSelectFilter
|
||||||
:label="t('Supplier *')"
|
:label="t('Supplier')"
|
||||||
class="full-width"
|
class="full-width"
|
||||||
v-model="data.supplierFk"
|
v-model="data.supplierFk"
|
||||||
:options="suppliersOptions"
|
:options="suppliersOptions"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="nickname"
|
option-label="nickname"
|
||||||
hide-selected
|
hide-selected
|
||||||
|
required
|
||||||
:rules="validate('entry.supplierFk')"
|
:rules="validate('entry.supplierFk')"
|
||||||
>
|
>
|
||||||
<template #option="scope">
|
<template #option="scope">
|
||||||
|
@ -83,7 +84,7 @@ const companiesOptions = ref([]);
|
||||||
</VnRow>
|
</VnRow>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
<VnSelectFilter
|
<VnSelectFilter
|
||||||
:label="t('Travel *')"
|
:label="t('Travel')"
|
||||||
class="full-width"
|
class="full-width"
|
||||||
v-model="data.travelFk"
|
v-model="data.travelFk"
|
||||||
:options="travelsOptionsOptions"
|
:options="travelsOptionsOptions"
|
||||||
|
@ -91,6 +92,7 @@ const companiesOptions = ref([]);
|
||||||
option-label="warehouseInName"
|
option-label="warehouseInName"
|
||||||
map-options
|
map-options
|
||||||
hide-selected
|
hide-selected
|
||||||
|
required
|
||||||
:rules="validate('entry.travelFk')"
|
:rules="validate('entry.travelFk')"
|
||||||
>
|
>
|
||||||
<template #option="scope">
|
<template #option="scope">
|
||||||
|
@ -111,7 +113,7 @@ const companiesOptions = ref([]);
|
||||||
</VnRow>
|
</VnRow>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
<VnSelectFilter
|
<VnSelectFilter
|
||||||
:label="t('Company *')"
|
:label="t('Company')"
|
||||||
class="full-width"
|
class="full-width"
|
||||||
v-model="data.companyFk"
|
v-model="data.companyFk"
|
||||||
:options="companiesOptions"
|
:options="companiesOptions"
|
||||||
|
@ -129,7 +131,7 @@ const companiesOptions = ref([]);
|
||||||
|
|
||||||
<i18n>
|
<i18n>
|
||||||
es:
|
es:
|
||||||
Supplier *: Proveedor *
|
Supplier: Proveedor
|
||||||
Travel *: Envío *
|
Travel: Envío
|
||||||
Company *: Empresa *
|
Company: Empresa
|
||||||
</i18n>
|
</i18n>
|
||||||
|
|
Loading…
Reference in New Issue