forked from verdnatura/salix-front
Merge branch 'dev' of https://gitea.verdnatura.es/verdnatura/salix-front into 6891-showRightSideFilterPanel
This commit is contained in:
commit
1d16abd572
|
|
@ -81,6 +81,7 @@ defineExpose({
|
|||
hasChanges,
|
||||
saveChanges,
|
||||
getChanges,
|
||||
formData,
|
||||
});
|
||||
|
||||
async function fetch(data) {
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ const $props = defineProps({
|
|||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const requiredFieldRule = (val) => !!val || t('globals.fieldRequired');
|
||||
const requiredFieldRule = (val) => val ?? t('globals.fieldRequired');
|
||||
|
||||
const { optionLabel, optionValue, options, modelValue } = toRefs($props);
|
||||
const myOptions = ref([]);
|
||||
|
|
@ -167,6 +167,7 @@ watch(modelValue, (newValue) => {
|
|||
hide-selected
|
||||
fill-input
|
||||
ref="vnSelectRef"
|
||||
lazy-rules
|
||||
:class="{ required: $attrs.required }"
|
||||
:rules="$attrs.required ? [requiredFieldRule] : null"
|
||||
virtual-scroll-slice-size="options.length"
|
||||
|
|
|
|||
|
|
@ -1 +1,191 @@
|
|||
<template>Item tags (CREAR CUANDO SE DESARROLLE EL MODULO DE ITEMS)</template>
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import CrudModel from 'components/CrudModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
|
||||
import axios from 'axios';
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
||||
const itemTagsRef = ref(null);
|
||||
const tagOptions = ref([]);
|
||||
const valueOptionsMap = ref(new Map());
|
||||
|
||||
const getSelectedTagValues = async (tag) => {
|
||||
try {
|
||||
if (!tag.tagFk && tag.tag.isFree) return;
|
||||
const filter = {
|
||||
fields: ['value'],
|
||||
order: 'value ASC',
|
||||
};
|
||||
|
||||
const params = { filter: JSON.stringify(filter) };
|
||||
const { data } = await axios.get(`Tags/${tag.tagFk}/filterValue`, {
|
||||
params,
|
||||
});
|
||||
valueOptionsMap.value.set(tag.tagFk, data);
|
||||
} catch (err) {
|
||||
console.error('Error getting selected tag values');
|
||||
}
|
||||
};
|
||||
|
||||
const onItemTagsFetched = async (itemTags) => {
|
||||
(itemTags || []).forEach((tag) => {
|
||||
getSelectedTagValues(tag);
|
||||
});
|
||||
};
|
||||
|
||||
const handleTagSelected = (rows, index, tag) => {
|
||||
rows[index].tag = tag;
|
||||
rows[index].tagFk = tag.id;
|
||||
rows[index].value = null;
|
||||
getSelectedTagValues(rows[index]);
|
||||
};
|
||||
|
||||
const getHighestPriority = (rows) => {
|
||||
let max = 0;
|
||||
rows.forEach((tag) => {
|
||||
if (tag.priority > max) max = tag.priority;
|
||||
});
|
||||
return max + 1;
|
||||
};
|
||||
|
||||
const insertTag = (rows) => {
|
||||
itemTagsRef.value.insert();
|
||||
itemTagsRef.value.formData[itemTagsRef.value.formData.length - 1].priority =
|
||||
getHighestPriority(rows);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="Tags"
|
||||
:filter="{ fields: ['id', 'name', 'isFree', 'sourceTable'] }"
|
||||
@on-fetch="(data) => (tagOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<div class="full-width flex justify-center">
|
||||
<QPage class="card-width q-pa-lg">
|
||||
<CrudModel
|
||||
ref="itemTagsRef"
|
||||
data-key="ItemTags"
|
||||
model="ItemTags"
|
||||
url="ItemTags"
|
||||
update-url="Tags/onSubmit"
|
||||
:data-required="{
|
||||
$index: undefined,
|
||||
itemFk: route.params.id,
|
||||
priority: undefined,
|
||||
tag: {
|
||||
isFree: undefined,
|
||||
value: undefined,
|
||||
name: undefined,
|
||||
},
|
||||
tagFk: undefined,
|
||||
}"
|
||||
:default-remove="false"
|
||||
:filter="{
|
||||
fields: ['id', 'itemFk', 'tagFk', 'value', 'priority'],
|
||||
where: { itemFk: route.params.id },
|
||||
order: 'priority ASC',
|
||||
include: {
|
||||
relation: 'tag',
|
||||
scope: {
|
||||
fields: ['id', 'name', 'isFree', 'sourceTable'],
|
||||
},
|
||||
},
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="onItemTagsFetched"
|
||||
>
|
||||
<template #body="{ rows, validate }">
|
||||
<QCard class="q-pl-lg q-py-md">
|
||||
<VnRow
|
||||
v-for="(row, index) in rows"
|
||||
:key="index"
|
||||
class="row q-gutter-md q-mb-md"
|
||||
>
|
||||
<VnSelect
|
||||
:label="t('itemTags.tag')"
|
||||
:options="tagOptions"
|
||||
:model-value="row.tag"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
@update:model-value="
|
||||
($event) => handleTagSelected(rows, index, $event)
|
||||
"
|
||||
:required="true"
|
||||
:rules="validate('itemTag.tagFk')"
|
||||
/>
|
||||
<VnSelect
|
||||
v-if="row.tag?.isFree === false"
|
||||
:key="row.tagFk"
|
||||
:label="t('Value')"
|
||||
v-model="row.value"
|
||||
:options="valueOptionsMap.get(row.tagFk)"
|
||||
option-label="value"
|
||||
option-value="value"
|
||||
emit-value
|
||||
use-input
|
||||
class="col"
|
||||
:is-clearable="false"
|
||||
:required="false"
|
||||
:rules="validate('itemTag.tagFk')"
|
||||
/>
|
||||
<VnInput
|
||||
v-else-if="
|
||||
row.tag?.isFree || row.tag?.isFree == undefined
|
||||
"
|
||||
v-model="row.value"
|
||||
:label="t('itemTags.value')"
|
||||
:is-clearable="false"
|
||||
style="width: 100%"
|
||||
/>
|
||||
<VnInput
|
||||
:label="t('itemTags.relevancy')"
|
||||
type="number"
|
||||
v-model="row.priority"
|
||||
:required="true"
|
||||
:rules="validate('itemTag.priority')"
|
||||
/>
|
||||
<div class="col-1 row justify-center items-center">
|
||||
<QIcon
|
||||
@click="itemTagsRef.remove([row])"
|
||||
class="fill-icon-on-hover"
|
||||
color="primary"
|
||||
name="delete"
|
||||
size="sm"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ t('itemTags.removeTag') }}
|
||||
</QTooltip>
|
||||
</QIcon>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow>
|
||||
<QIcon
|
||||
@click="insertTag(rows)"
|
||||
class="cursor-pointer"
|
||||
:disable="!validRow"
|
||||
color="primary"
|
||||
name="add"
|
||||
size="sm"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ t('itemTags.addTag') }}
|
||||
</QTooltip>
|
||||
</QIcon>
|
||||
</VnRow>
|
||||
</QCard>
|
||||
</template>
|
||||
</CrudModel>
|
||||
</QPage>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -72,3 +72,9 @@ lastEntries:
|
|||
package: Package
|
||||
freight: Freight
|
||||
comission: Comission
|
||||
itemTags:
|
||||
removeTag: Remove tag
|
||||
addTag: Add tag
|
||||
tag: Tag
|
||||
value: Value
|
||||
relevancy: Relevancy
|
||||
|
|
|
|||
|
|
@ -72,3 +72,9 @@ lastEntries:
|
|||
package: Embalaje
|
||||
freight: Porte
|
||||
comission: Comisión
|
||||
itemTags:
|
||||
removeTag: Quitar etiqueta
|
||||
addTag: Añadir etiqueta
|
||||
tag: Etiqueta
|
||||
value: Valor
|
||||
relevancy: Relevancia
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@ export default {
|
|||
'ItemBarcode',
|
||||
'ItemShelving',
|
||||
'ItemLastEntries',
|
||||
'ItemTags',
|
||||
],
|
||||
},
|
||||
children: [
|
||||
|
|
|
|||
Loading…
Reference in New Issue