0
0
Fork 0
This commit is contained in:
William Buezas 2024-01-04 09:34:24 -03:00
parent aee4696bb2
commit de8996d596
9 changed files with 191 additions and 54 deletions

View File

@ -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

View File

@ -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>

View File

@ -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()"

View File

@ -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

View File

@ -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>

8
src/filters/dateRange.js Normal file
View File

@ -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];
}

View File

@ -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,
}; };

View File

@ -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>

View File

@ -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>