forked from verdnatura/salix-front
Merge branch 'dev' into feature/SaleTracking
This commit is contained in:
commit
cc8062785a
|
@ -5,6 +5,7 @@ import { dashIfEmpty } from 'src/filters';
|
|||
|
||||
/* basic input */
|
||||
import VnSelect from 'components/common/VnSelect.vue';
|
||||
import VnSelectCache from 'components/common/VnSelectCache.vue';
|
||||
import VnInput from 'components/common/VnInput.vue';
|
||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||
import VnComponent from 'components/common/VnComponent.vue';
|
||||
|
@ -41,6 +42,17 @@ const $props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const defaultSelect = {
|
||||
attrs: {
|
||||
row: $props.row,
|
||||
disable: !$props.isEditable,
|
||||
class: 'fit',
|
||||
},
|
||||
forceAttrs: {
|
||||
label: $props.showLabel && $props.column.label,
|
||||
},
|
||||
};
|
||||
|
||||
const defaultComponents = {
|
||||
input: {
|
||||
component: markRaw(VnInput),
|
||||
|
@ -94,14 +106,12 @@ const defaultComponents = {
|
|||
},
|
||||
},
|
||||
select: {
|
||||
component: markRaw(VnSelectCache),
|
||||
...defaultSelect,
|
||||
},
|
||||
rawSelect: {
|
||||
component: markRaw(VnSelect),
|
||||
attrs: {
|
||||
disable: !$props.isEditable,
|
||||
class: 'fit',
|
||||
},
|
||||
forceAttrs: {
|
||||
label: $props.showLabel && $props.column.label,
|
||||
},
|
||||
...defaultSelect,
|
||||
},
|
||||
icon: {
|
||||
component: markRaw(QIcon),
|
||||
|
|
|
@ -139,14 +139,11 @@ const showFilter = computed(
|
|||
</script>
|
||||
<template>
|
||||
<div
|
||||
v-if="showTitle"
|
||||
class="q-pt-sm q-px-sm ellipsis"
|
||||
:class="`text-${column?.align ?? 'left'}`"
|
||||
:style="!showFilter ? { 'min-height': 72 + 'px' } : ''"
|
||||
v-if="showFilter"
|
||||
class="full-width"
|
||||
:class="alignRow()"
|
||||
style="max-height: 45px; overflow: hidden"
|
||||
>
|
||||
{{ column?.label }}
|
||||
</div>
|
||||
<div v-if="showFilter" class="full-width" :class="alignRow()">
|
||||
<VnTableColumn
|
||||
:column="$props.column"
|
||||
default="input"
|
||||
|
|
|
@ -0,0 +1,95 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
const model = defineModel({ type: Object, required: true });
|
||||
const $props = defineProps({
|
||||
name: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
default: undefined,
|
||||
},
|
||||
dataKey: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
searchUrl: {
|
||||
type: String,
|
||||
default: 'params',
|
||||
},
|
||||
vertical: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
});
|
||||
const hover = ref();
|
||||
const arrayData = useArrayData($props.dataKey, { searchUrl: $props.searchUrl });
|
||||
|
||||
async function orderBy(name, direction) {
|
||||
if (!name) return;
|
||||
switch (direction) {
|
||||
case 'DESC':
|
||||
direction = undefined;
|
||||
break;
|
||||
case undefined:
|
||||
direction = 'ASC';
|
||||
break;
|
||||
case 'ASC':
|
||||
direction = 'DESC';
|
||||
break;
|
||||
}
|
||||
if (!direction) return await arrayData.deleteOrder(name);
|
||||
await arrayData.addOrder(name, direction);
|
||||
}
|
||||
|
||||
defineExpose({ orderBy });
|
||||
</script>
|
||||
<template>
|
||||
<div
|
||||
@mouseenter="hover = true"
|
||||
@mouseleave="hover = false"
|
||||
@click="orderBy(name, model?.direction)"
|
||||
class="row items-center no-wrap cursor-pointer"
|
||||
>
|
||||
<span :title="label">{{ label }}</span>
|
||||
<QChip
|
||||
v-if="name"
|
||||
:label="!vertical && model?.index"
|
||||
:icon="
|
||||
(model?.index || hover) && !vertical
|
||||
? model?.direction == 'DESC'
|
||||
? 'arrow_downward'
|
||||
: 'arrow_upward'
|
||||
: undefined
|
||||
"
|
||||
:size="vertical ? '' : 'sm'"
|
||||
:class="[
|
||||
model?.index ? 'color-vn-text' : 'bg-transparent',
|
||||
vertical ? 'q-px-none' : '',
|
||||
]"
|
||||
class="no-box-shadow"
|
||||
:clickable="true"
|
||||
style="min-width: 40px"
|
||||
>
|
||||
<div
|
||||
class="column flex-center"
|
||||
v-if="vertical"
|
||||
:style="!model?.index && 'color: #5d5d5d'"
|
||||
>
|
||||
{{ model?.index }}
|
||||
<QIcon
|
||||
:name="
|
||||
model?.index
|
||||
? model?.direction == 'DESC'
|
||||
? 'arrow_downward'
|
||||
: 'arrow_upward'
|
||||
: 'swap_vert'
|
||||
"
|
||||
size="xs"
|
||||
/>
|
||||
</div>
|
||||
</QChip>
|
||||
</div>
|
||||
</template>
|
|
@ -13,7 +13,8 @@ import VnLv from 'components/ui/VnLv.vue';
|
|||
import VnTableColumn from 'components/VnTable/VnColumn.vue';
|
||||
import VnTableFilter from 'components/VnTable/VnFilter.vue';
|
||||
import VnTableChip from 'components/VnTable/VnChip.vue';
|
||||
import TableVisibleColumns from 'src/components/VnTable/VnVisibleColumn.vue';
|
||||
import VnVisibleColumn from 'src/components/VnTable/VnVisibleColumn.vue';
|
||||
import VnTableOrder from 'src/components/VnTable/VnOrder.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
columns: {
|
||||
|
@ -22,7 +23,7 @@ const $props = defineProps({
|
|||
},
|
||||
defaultMode: {
|
||||
type: String,
|
||||
default: 'card', // 'table', 'card'
|
||||
default: 'table', // 'table', 'card'
|
||||
},
|
||||
columnSearch: {
|
||||
type: Boolean,
|
||||
|
@ -68,6 +69,10 @@ const $props = defineProps({
|
|||
type: Object,
|
||||
default: () => ({ card: false, table: false }),
|
||||
},
|
||||
withoutHeader: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
tableCode: {
|
||||
type: String,
|
||||
default: null,
|
||||
|
@ -89,9 +94,11 @@ const mode = ref(DEFAULT_MODE);
|
|||
const selected = ref([]);
|
||||
const routeQuery = JSON.parse(route?.query[$props.searchUrl] ?? '{}');
|
||||
const params = ref({ ...routeQuery, ...routeQuery.filter?.where });
|
||||
const orders = ref(parseOrder(routeQuery.filter?.order));
|
||||
const CrudModelRef = ref({});
|
||||
const showForm = ref(false);
|
||||
const splittedColumns = ref({ columns: [] });
|
||||
const columnsVisibilitySkiped = ref();
|
||||
const tableModes = [
|
||||
{
|
||||
icon: 'view_column',
|
||||
|
@ -111,6 +118,12 @@ onMounted(() => {
|
|||
mode.value = quasar.platform.is.mobile ? DEFAULT_MODE : $props.defaultMode;
|
||||
stateStore.rightDrawer = true;
|
||||
setUserParams(route.query[$props.searchUrl]);
|
||||
columnsVisibilitySkiped.value = [
|
||||
...splittedColumns.value.columns
|
||||
.filter((c) => c.visible == false)
|
||||
.map((c) => c.name),
|
||||
...['tableActions'],
|
||||
];
|
||||
});
|
||||
|
||||
watch(
|
||||
|
@ -136,10 +149,15 @@ function setUserParams(watchedParams) {
|
|||
if (!watchedParams) return;
|
||||
|
||||
if (typeof watchedParams == 'string') watchedParams = JSON.parse(watchedParams);
|
||||
const where = JSON.parse(watchedParams?.filter)?.where;
|
||||
const filter = JSON.parse(watchedParams?.filter);
|
||||
const where = filter?.where;
|
||||
const order = filter?.order;
|
||||
|
||||
watchedParams = { ...watchedParams, ...where };
|
||||
delete watchedParams.filter;
|
||||
delete params.value?.filter;
|
||||
params.value = { ...params.value, ...watchedParams };
|
||||
orders.value = parseOrder(order);
|
||||
}
|
||||
|
||||
function splitColumns(columns) {
|
||||
|
@ -147,7 +165,7 @@ function splitColumns(columns) {
|
|||
columns: [],
|
||||
chips: [],
|
||||
create: [],
|
||||
visible: [],
|
||||
cardVisible: [],
|
||||
};
|
||||
|
||||
for (const col of columns) {
|
||||
|
@ -155,7 +173,7 @@ function splitColumns(columns) {
|
|||
if (col.chip) splittedColumns.value.chips.push(col);
|
||||
if (col.isTitle) splittedColumns.value.title = col;
|
||||
if (col.create) splittedColumns.value.create.push(col);
|
||||
if (col.cardVisible) splittedColumns.value.visible.push(col);
|
||||
if (col.cardVisible) splittedColumns.value.cardVisible.push(col);
|
||||
if ($props.isEditable && col.disable == null) col.disable = false;
|
||||
if ($props.useModel) col.columnFilter = { ...col.columnFilter, inWhere: true };
|
||||
splittedColumns.value.columns.push(col);
|
||||
|
@ -171,6 +189,7 @@ function splitColumns(columns) {
|
|||
label: t('status'),
|
||||
name: 'tableStatus',
|
||||
columnFilter: false,
|
||||
orderBy: false,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -199,6 +218,17 @@ function getColAlign(col) {
|
|||
return 'text-' + (col.align ?? 'left');
|
||||
}
|
||||
|
||||
function parseOrder(urlOrders) {
|
||||
const orderObject = {};
|
||||
if (!urlOrders) return orderObject;
|
||||
if (typeof urlOrders == 'string') urlOrders = [urlOrders];
|
||||
for (const [index, orders] of urlOrders.entries()) {
|
||||
const [name, direction] = orders.split(' ');
|
||||
orderObject[name] = { direction, index: index + 1 };
|
||||
}
|
||||
return orderObject;
|
||||
}
|
||||
|
||||
const emit = defineEmits(['onFetch', 'update:selected', 'saveChanges']);
|
||||
defineExpose({
|
||||
reload,
|
||||
|
@ -224,20 +254,31 @@ defineExpose({
|
|||
:redirect="!!redirect"
|
||||
>
|
||||
<template #body>
|
||||
<VnTableFilter
|
||||
:column="col"
|
||||
:data-key="$attrs['data-key']"
|
||||
<div
|
||||
class="row no-wrap flex-center"
|
||||
v-for="col of splittedColumns.columns"
|
||||
:key="col.id"
|
||||
v-model="params[columnName(col)]"
|
||||
:search-url="searchUrl"
|
||||
>
|
||||
<VnTableFilter
|
||||
:column="col"
|
||||
:data-key="$attrs['data-key']"
|
||||
v-model="params[columnName(col)]"
|
||||
:search-url="searchUrl"
|
||||
/>
|
||||
<VnTableOrder
|
||||
v-model="orders[col.name]"
|
||||
:name="col.orderBy ?? col.name"
|
||||
:data-key="$attrs['data-key']"
|
||||
:search-url="searchUrl"
|
||||
:vertical="true"
|
||||
/>
|
||||
</div>
|
||||
<slot
|
||||
name="moreFilterPanel"
|
||||
:params="params"
|
||||
:columns="splittedColumns.columns"
|
||||
/>
|
||||
</template>
|
||||
<slot
|
||||
name="moreFilterPanel"
|
||||
:params="params"
|
||||
:columns="splittedColumns.columns"
|
||||
/>
|
||||
</VnFilterPanel>
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
|
@ -280,14 +321,15 @@ defineExpose({
|
|||
@row-click="(_, row) => rowClickFunction(row)"
|
||||
@update:selected="emit('update:selected', $event)"
|
||||
>
|
||||
<template #top-left>
|
||||
<template #top-left v-if="!$props.withoutHeader">
|
||||
<slot name="top-left"></slot>
|
||||
</template>
|
||||
<template #top-right>
|
||||
<TableVisibleColumns
|
||||
<VnVisibleColumn
|
||||
v-if="isTableMode"
|
||||
v-model="splittedColumns.columns"
|
||||
:table-code="tableCode ?? route.name"
|
||||
:skip="columnsVisibilitySkiped"
|
||||
/>
|
||||
<QBtnToggle
|
||||
v-model="mode"
|
||||
|
@ -306,18 +348,33 @@ defineExpose({
|
|||
/>
|
||||
</template>
|
||||
<template #header-cell="{ col }">
|
||||
<QTh
|
||||
auto-width
|
||||
style="min-width: 100px"
|
||||
v-if="$props.columnSearch && col.visible"
|
||||
>
|
||||
<VnTableFilter
|
||||
:column="col"
|
||||
:show-title="true"
|
||||
:data-key="$attrs['data-key']"
|
||||
v-model="params[columnName(col)]"
|
||||
:search-url="searchUrl"
|
||||
/>
|
||||
<QTh v-if="col.visible ?? true" auto-width>
|
||||
<div
|
||||
class="column self-start q-ml-xs ellipsis"
|
||||
:class="`text-${col?.align ?? 'left'}`"
|
||||
style="height: 75px"
|
||||
>
|
||||
<div
|
||||
class="row items-center no-wrap"
|
||||
style="height: 30px"
|
||||
>
|
||||
<VnTableOrder
|
||||
v-model="orders[col.name]"
|
||||
:name="col.orderBy ?? col.name"
|
||||
:label="col?.label"
|
||||
:data-key="$attrs['data-key']"
|
||||
:search-url="searchUrl"
|
||||
/>
|
||||
</div>
|
||||
<VnTableFilter
|
||||
v-if="$props.columnSearch"
|
||||
:column="col"
|
||||
:show-title="true"
|
||||
:data-key="$attrs['data-key']"
|
||||
v-model="params[columnName(col)]"
|
||||
:search-url="searchUrl"
|
||||
/>
|
||||
</div>
|
||||
</QTh>
|
||||
</template>
|
||||
<template #header-cell-tableActions>
|
||||
|
@ -340,8 +397,8 @@ defineExpose({
|
|||
<QTd
|
||||
auto-width
|
||||
class="no-margin q-px-xs"
|
||||
:class="getColAlign(col)"
|
||||
v-if="col.visible"
|
||||
:class="[getColAlign(col), col.class, col.columnField?.class]"
|
||||
v-if="col.visible ?? true"
|
||||
>
|
||||
<slot :name="`column-${col.name}`" :col="col" :row="row">
|
||||
<VnTableColumn
|
||||
|
@ -430,7 +487,7 @@ defineExpose({
|
|||
:class="$props.cardClass"
|
||||
>
|
||||
<div
|
||||
v-for="col of splittedColumns.visible"
|
||||
v-for="col of splittedColumns.cardVisible"
|
||||
:key="col.name"
|
||||
class="fields"
|
||||
>
|
||||
|
@ -544,6 +601,10 @@ es:
|
|||
color: var(--vn-text-color);
|
||||
}
|
||||
|
||||
.color-vn-text {
|
||||
color: var(--vn-text-color);
|
||||
}
|
||||
|
||||
.q-table--dark .q-table__bottom,
|
||||
.q-table--dark thead,
|
||||
.q-table--dark tr,
|
||||
|
|
|
@ -12,6 +12,10 @@ const $props = defineProps({
|
|||
type: String,
|
||||
default: '',
|
||||
},
|
||||
skip: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
const { notify } = useNotify();
|
||||
|
@ -30,8 +34,12 @@ function setUserConfigViewData(data, isLocal) {
|
|||
if (!data) return;
|
||||
// Importante: El name de las columnas de la tabla debe conincidir con el name de las variables que devuelve la view config
|
||||
if (!isLocal) localColumns.value = [];
|
||||
// Array to Object
|
||||
const skippeds = $props.skip.reduce((a, v) => ({ ...a, [v]: v }), {});
|
||||
|
||||
for (let column of columns.value) {
|
||||
const { label, name } = column;
|
||||
if (skippeds[name]) continue;
|
||||
column.visible = data[name] ?? true;
|
||||
if (!isLocal) localColumns.value.push({ name, label, visible: column.visible });
|
||||
}
|
||||
|
@ -127,7 +135,7 @@ onMounted(async () => {
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<QBtn icon="vn:visible_columns" class="bg-vn-section-color q-mr-md" dense>
|
||||
<QBtn icon="vn:visible_columns" class="bg-vn-section-color q-mr-md q-px-sm" dense>
|
||||
<QPopupProxy ref="popupProxyRef">
|
||||
<QCard class="column q-pa-md">
|
||||
<QIcon name="info" size="sm" class="info-icon">
|
||||
|
|
|
@ -18,7 +18,7 @@ watchEffect(() => {
|
|||
(matched) => Object.keys(matched.meta).length
|
||||
);
|
||||
breadcrumbs.value.length = 0;
|
||||
|
||||
if (!matched.value[0]) return;
|
||||
if (matched.value[0].name != 'Dashboard') {
|
||||
root.value = useCamelCase(matched.value[0].path.substring(1).toLowerCase());
|
||||
|
||||
|
|
|
@ -75,6 +75,7 @@ const myOptions = ref([]);
|
|||
const myOptionsOriginal = ref([]);
|
||||
const vnSelectRef = ref();
|
||||
const dataRef = ref();
|
||||
const lastVal = ref();
|
||||
|
||||
const value = computed({
|
||||
get() {
|
||||
|
@ -85,14 +86,31 @@ const value = computed({
|
|||
},
|
||||
});
|
||||
|
||||
watch(options, (newValue) => {
|
||||
setOptions(newValue);
|
||||
});
|
||||
|
||||
watch(modelValue, (newValue) => {
|
||||
if (!myOptions.value.some((option) => option[optionValue.value] == newValue))
|
||||
fetchFilter(newValue);
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
setOptions(options.value);
|
||||
if ($props.url && $props.modelValue && !findKeyInOptions())
|
||||
fetchFilter($props.modelValue);
|
||||
if ($props.focusOnMount) setTimeout(() => vnSelectRef.value.showPopup(), 300);
|
||||
});
|
||||
|
||||
function findKeyInOptions() {
|
||||
if (!$props.options) return;
|
||||
return filter($props.modelValue, $props.options)?.length;
|
||||
}
|
||||
|
||||
function setOptions(data) {
|
||||
myOptions.value = JSON.parse(JSON.stringify(data));
|
||||
myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
|
||||
}
|
||||
onMounted(() => {
|
||||
setOptions(options.value);
|
||||
if ($props.url && $props.modelValue) fetchFilter($props.modelValue);
|
||||
});
|
||||
|
||||
function filter(val, options) {
|
||||
const search = val.toString().toLowerCase();
|
||||
|
@ -125,15 +143,21 @@ async function fetchFilter(val) {
|
|||
const defaultWhere = $props.useLike
|
||||
? { [key]: { like: `%${val}%` } }
|
||||
: { [key]: val };
|
||||
const where = { ...defaultWhere, ...$props.where };
|
||||
const where = { ...(val ? defaultWhere : {}), ...$props.where };
|
||||
const fetchOptions = { where, order: sortBy, limit };
|
||||
if (fields) fetchOptions.fields = fields;
|
||||
return dataRef.value.fetch(fetchOptions);
|
||||
}
|
||||
|
||||
async function filterHandler(val, update) {
|
||||
if (!$props.defaultFilter) return update();
|
||||
if (!val && lastVal.value === val) {
|
||||
lastVal.value = val;
|
||||
return update();
|
||||
}
|
||||
lastVal.value = val;
|
||||
let newOptions;
|
||||
|
||||
if (!$props.defaultFilter) return update();
|
||||
if ($props.url) {
|
||||
newOptions = await fetchFilter(val);
|
||||
} else newOptions = filter(val, myOptionsOriginal.value);
|
||||
|
@ -149,19 +173,6 @@ async function filterHandler(val, update) {
|
|||
}
|
||||
);
|
||||
}
|
||||
|
||||
watch(options, (newValue) => {
|
||||
setOptions(newValue);
|
||||
});
|
||||
|
||||
watch(modelValue, (newValue) => {
|
||||
if (!myOptions.value.some((option) => option[optionValue.value] == newValue))
|
||||
fetchFilter(newValue);
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
if ($props.focusOnMount) setTimeout(() => vnSelectRef.value.showPopup(), 300);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
<script setup>
|
||||
import { ref, onBeforeMount, useAttrs } from 'vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
row: {
|
||||
type: [Object],
|
||||
default: null,
|
||||
},
|
||||
find: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
const options = ref([]);
|
||||
onBeforeMount(async () => {
|
||||
const { url } = useAttrs();
|
||||
const findBy = $props.find ?? url?.charAt(0)?.toLocaleLowerCase() + url?.slice(1, -1);
|
||||
if (findBy) options.value = [$props.row[findBy]];
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<VnSelect v-bind="$attrs" :options="$attrs.options ?? options" />
|
||||
</template>
|
|
@ -56,7 +56,12 @@ onBeforeMount(async () => {
|
|||
skip: 0,
|
||||
});
|
||||
store = arrayData.store;
|
||||
entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
|
||||
entity = computed(() => {
|
||||
const data = (Array.isArray(store.data) ? store.data[0] : store.data) ?? {};
|
||||
if (data) emit('onFetch', data);
|
||||
return data;
|
||||
});
|
||||
|
||||
// It enables to load data only once if the module is the same as the dataKey
|
||||
if (!isSameDataKey.value || !route.params.id) await getData();
|
||||
watch(
|
||||
|
@ -85,9 +90,9 @@ function getValueFromPath(path) {
|
|||
const keys = path.toString().split('.');
|
||||
let current = entity.value;
|
||||
|
||||
for (let i = 0; i < keys.length; i++) {
|
||||
if (current[keys[i]] === undefined) return undefined;
|
||||
else current = current[keys[i]];
|
||||
for (const key of keys) {
|
||||
if (current[key] === undefined) return undefined;
|
||||
else current = current[key];
|
||||
}
|
||||
return current;
|
||||
}
|
||||
|
|
|
@ -52,6 +52,10 @@ const dialog = ref(null);
|
|||
:value="item?.[`value${index + 4}`]"
|
||||
/>
|
||||
</template>
|
||||
<div v-if="item.minQuantity" class="min-quantity">
|
||||
<QIcon name="production_quantity_limits" size="xs" />
|
||||
{{ item.minQuantity }}
|
||||
</div>
|
||||
<div class="footer">
|
||||
<div class="price">
|
||||
<p v-if="isCatalog">
|
||||
|
@ -133,6 +137,11 @@ const dialog = ref(null);
|
|||
}
|
||||
}
|
||||
|
||||
.min-quantity {
|
||||
text-align: right;
|
||||
color: $negative !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
.price {
|
||||
overflow: hidden;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { onMounted, onBeforeUnmount, ref, nextTick } from 'vue';
|
||||
import { onMounted, onBeforeUnmount, ref } from 'vue';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
|
|
|
@ -24,10 +24,11 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
const searchUrl = store.searchUrl;
|
||||
if (query[searchUrl]) {
|
||||
const params = JSON.parse(query[searchUrl]);
|
||||
const filter = params?.filter;
|
||||
const filter = params?.filter && JSON.parse(params?.filter ?? '{}');
|
||||
delete params.filter;
|
||||
store.userParams = { ...params, ...store.userParams };
|
||||
store.userFilter = { ...JSON.parse(filter ?? '{}'), ...store.userFilter };
|
||||
store.userFilter = { ...filter, ...store.userFilter };
|
||||
if (filter.order) store.order = filter.order;
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -69,7 +70,6 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
canceller = new AbortController();
|
||||
|
||||
const filter = {
|
||||
order: store.order,
|
||||
limit: store.limit,
|
||||
};
|
||||
|
||||
|
@ -94,6 +94,8 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
|
||||
Object.assign(params, userParams);
|
||||
params.filter.skip = store.skip;
|
||||
if (store.order && store.order.length) params.filter.order = store.order;
|
||||
else delete params.filter.order;
|
||||
|
||||
params.filter = JSON.stringify(params.filter);
|
||||
store.currentFilter = params;
|
||||
|
@ -147,7 +149,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
store.filter = {};
|
||||
if (params) store.userParams = { ...params };
|
||||
|
||||
const response = await fetch({ append: false });
|
||||
const response = await fetch({});
|
||||
return response;
|
||||
}
|
||||
|
||||
|
@ -160,7 +162,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
store.userParams = userParams;
|
||||
arrayDataStore.reset(['skip', 'filter.skip', 'page']);
|
||||
|
||||
await fetch({ append: false });
|
||||
await fetch({});
|
||||
return { filter, params };
|
||||
}
|
||||
|
||||
|
@ -171,6 +173,37 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
await addFilter({ filter: { where } });
|
||||
}
|
||||
|
||||
async function addOrder(field, direction = 'ASC') {
|
||||
const newOrder = field + ' ' + direction;
|
||||
let order = store.order || [];
|
||||
if (typeof order == 'string') order = [order];
|
||||
|
||||
let index = order.findIndex((o) => o.split(' ')[0] === field);
|
||||
if (index > -1) {
|
||||
order[index] = newOrder;
|
||||
} else {
|
||||
index = order.length;
|
||||
order.push(newOrder);
|
||||
}
|
||||
|
||||
store.order = order;
|
||||
fetch({});
|
||||
index++;
|
||||
|
||||
return { index, order };
|
||||
}
|
||||
|
||||
async function deleteOrder(field) {
|
||||
let order = store.order ?? [];
|
||||
if (typeof order == 'string') order = [order];
|
||||
|
||||
const index = order.findIndex((o) => o.split(' ')[0] === field);
|
||||
if (index > -1) order.splice(index, 1);
|
||||
|
||||
store.order = order;
|
||||
fetch({});
|
||||
}
|
||||
|
||||
function sanitizerParams(params, exprBuilder) {
|
||||
for (const param in params) {
|
||||
if (params[param] === '' || params[param] === null) {
|
||||
|
@ -198,7 +231,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
}
|
||||
|
||||
async function refresh() {
|
||||
if (Object.values(store.userParams).length) await fetch({ append: false });
|
||||
if (Object.values(store.userParams).length) await fetch({});
|
||||
}
|
||||
|
||||
function updateStateParams() {
|
||||
|
@ -240,6 +273,8 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
applyFilter,
|
||||
addFilter,
|
||||
addFilterWhere,
|
||||
addOrder,
|
||||
deleteOrder,
|
||||
refresh,
|
||||
destroy,
|
||||
loadMore,
|
||||
|
|
|
@ -229,3 +229,29 @@ input::-webkit-inner-spin-button {
|
|||
*::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.q-table {
|
||||
thead,
|
||||
tbody {
|
||||
th {
|
||||
.q-select {
|
||||
max-width: 120px;
|
||||
}
|
||||
}
|
||||
td {
|
||||
padding: 1px 10px 1px 10px;
|
||||
max-width: 100px;
|
||||
div span {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.expand {
|
||||
max-width: 400px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -633,69 +633,6 @@ ticket:
|
|||
landed: Landed
|
||||
warehouse: Warehouse
|
||||
agency: Agency
|
||||
claim:
|
||||
list:
|
||||
customer: Customer
|
||||
assignedTo: Assigned
|
||||
created: Created
|
||||
state: State
|
||||
rmaList:
|
||||
code: Code
|
||||
records: records
|
||||
card:
|
||||
claimId: Claim ID
|
||||
attendedBy: Attended by
|
||||
created: Created
|
||||
state: State
|
||||
ticketId: Ticket ID
|
||||
customerSummary: Customer summary
|
||||
claimedTicket: Claimed ticket
|
||||
saleTracking: Sale tracking
|
||||
ticketTracking: Ticket tracking
|
||||
commercial: Commercial
|
||||
province: Province
|
||||
zone: Zone
|
||||
customerId: client ID
|
||||
summary:
|
||||
customer: Customer
|
||||
assignedTo: Assigned
|
||||
attendedBy: Attended by
|
||||
created: Created
|
||||
state: State
|
||||
details: Details
|
||||
item: Item
|
||||
landed: Landed
|
||||
quantity: Quantity
|
||||
claimed: Claimed
|
||||
price: Price
|
||||
discount: Discount
|
||||
total: Total
|
||||
actions: Actions
|
||||
responsibility: Responsibility
|
||||
company: Company
|
||||
person: Employee/Customer
|
||||
notes: Notes
|
||||
photos: Photos
|
||||
development: Development
|
||||
reason: Reason
|
||||
result: Result
|
||||
responsible: Responsible
|
||||
worker: Worker
|
||||
redelivery: Redelivery
|
||||
changeState: Change state
|
||||
basicData:
|
||||
customer: Customer
|
||||
assignedTo: Assigned
|
||||
created: Created
|
||||
state: State
|
||||
pickup: Pick up
|
||||
null: No
|
||||
agency: Agency
|
||||
delivery: Delivery
|
||||
photo:
|
||||
fileDescription: 'Claim id {claimId} from client {clientName} id {clientId}'
|
||||
noData: 'There are no images/videos, click here or drag and drop the file'
|
||||
dragDrop: Drag and drop it here
|
||||
invoiceOut:
|
||||
list:
|
||||
ref: Reference
|
||||
|
|
|
@ -638,69 +638,6 @@ ticket:
|
|||
landed: F. entrega
|
||||
warehouse: Almacén
|
||||
agency: Agencia
|
||||
claim:
|
||||
list:
|
||||
customer: Cliente
|
||||
assignedTo: Asignada a
|
||||
created: Creada
|
||||
state: Estado
|
||||
rmaList:
|
||||
code: Código
|
||||
records: registros
|
||||
card:
|
||||
claimId: ID reclamación
|
||||
attendedBy: Atendida por
|
||||
created: Creada
|
||||
state: Estado
|
||||
ticketId: ID ticket
|
||||
customerSummary: Resumen del cliente
|
||||
claimedTicket: Ticket reclamado
|
||||
saleTracking: Líneas preparadas
|
||||
ticketTracking: Estados del ticket
|
||||
commercial: Comercial
|
||||
province: Provincia
|
||||
zone: Zona
|
||||
customerId: ID del cliente
|
||||
summary:
|
||||
customer: Cliente
|
||||
assignedTo: Asignada a
|
||||
attendedBy: Atendida por
|
||||
created: Creada
|
||||
state: Estado
|
||||
details: Detalles
|
||||
item: Artículo
|
||||
landed: Entregado
|
||||
quantity: Cantidad
|
||||
claimed: Reclamado
|
||||
price: Precio
|
||||
discount: Descuento
|
||||
total: Total
|
||||
actions: Acciones
|
||||
responsibility: Responsabilidad
|
||||
company: Empresa
|
||||
person: Comercial/Cliente
|
||||
notes: Observaciones
|
||||
photos: Fotos
|
||||
development: Trazabilidad
|
||||
reason: Motivo
|
||||
result: Consecuencias
|
||||
responsible: Responsable
|
||||
worker: Trabajador
|
||||
redelivery: Devolución
|
||||
changeState: Cambiar estado
|
||||
basicData:
|
||||
customer: Cliente
|
||||
assignedTo: Asignada a
|
||||
created: Creada
|
||||
state: Estado
|
||||
pickup: Recogida
|
||||
null: No
|
||||
agency: Agencia
|
||||
delivery: Reparto
|
||||
photo:
|
||||
fileDescription: 'Reclamacion ID {claimId} del cliente {clientName} id {clientId}'
|
||||
noData: No hay imágenes/videos haz click aquí o arrastra y suelta el archivo
|
||||
dragDrop: Arrástralo y sueltalo aquí
|
||||
invoiceOut:
|
||||
list:
|
||||
ref: Referencia
|
||||
|
|
|
@ -33,8 +33,8 @@ const DEFAULT_MAX_RESPONSABILITY = 5;
|
|||
const DEFAULT_MIN_RESPONSABILITY = 1;
|
||||
const arrayData = useArrayData('claimData');
|
||||
const marker_labels = [
|
||||
{ value: DEFAULT_MIN_RESPONSABILITY, label: t('claim.summary.company') },
|
||||
{ value: DEFAULT_MAX_RESPONSABILITY, label: t('claim.summary.person') },
|
||||
{ value: DEFAULT_MIN_RESPONSABILITY, label: t('claim.company') },
|
||||
{ value: DEFAULT_MAX_RESPONSABILITY, label: t('claim.person') },
|
||||
];
|
||||
const multiplicatorValue = ref();
|
||||
const loading = ref(false);
|
||||
|
@ -209,12 +209,12 @@ async function post(query, params) {
|
|||
<QItem class="justify-between">
|
||||
<QItemLabel class="slider-container">
|
||||
<p class="text-primary">
|
||||
{{ t('claim.summary.actions') }}
|
||||
{{ t('claim.actions') }}
|
||||
</p>
|
||||
<QSlider
|
||||
class="responsibility { 'background-color:primary': quasar.platform.is.mobile }"
|
||||
v-model="claim.responsibility"
|
||||
:label-value="t('claim.summary.responsibility')"
|
||||
:label-value="t('claim.responsibility')"
|
||||
@change="(value) => save({ responsibility: value })"
|
||||
label-always
|
||||
color="primary"
|
||||
|
|
|
@ -30,7 +30,7 @@ function setClaimStates(data) {
|
|||
}
|
||||
|
||||
async function getEnumValues() {
|
||||
optionsList.value = [{ id: null, description: t('claim.basicData.null') }];
|
||||
optionsList.value = [{ id: null, description: t('claim.null') }];
|
||||
const { data } = await axios.get(`Applications/get-enum-values`, {
|
||||
params: {
|
||||
schema: 'vn',
|
||||
|
@ -39,7 +39,7 @@ async function getEnumValues() {
|
|||
},
|
||||
});
|
||||
for (let value of data)
|
||||
optionsList.value.push({ id: value, description: t(`claim.basicData.${value}`) });
|
||||
optionsList.value.push({ id: value, description: t(`claim.${value}`) });
|
||||
}
|
||||
|
||||
getEnumValues();
|
||||
|
@ -77,17 +77,14 @@ const statesFilter = {
|
|||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.client.name"
|
||||
:label="t('claim.basicData.customer')"
|
||||
:label="t('claim.customer')"
|
||||
disable
|
||||
/>
|
||||
<VnInputDate
|
||||
v-model="data.created"
|
||||
:label="t('claim.basicData.created')"
|
||||
/>
|
||||
<VnInputDate v-model="data.created" :label="t('claim.created')" />
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnSelect
|
||||
:label="t('claim.basicData.assignedTo')"
|
||||
:label="t('claim.assignedTo')"
|
||||
v-model="data.workerFk"
|
||||
:options="workersOptions"
|
||||
option-value="id"
|
||||
|
@ -114,7 +111,7 @@ const statesFilter = {
|
|||
option-value="id"
|
||||
option-label="description"
|
||||
emit-value
|
||||
:label="t('claim.basicData.state')"
|
||||
:label="t('claim.state')"
|
||||
map-options
|
||||
use-input
|
||||
@filter="(value, update) => filter(value, update, statesFilter)"
|
||||
|
@ -136,7 +133,7 @@ const statesFilter = {
|
|||
option-value="id"
|
||||
option-label="description"
|
||||
emit-value
|
||||
:label="t('claim.basicData.pickup')"
|
||||
:label="t('claim.pickup')"
|
||||
map-options
|
||||
use-input
|
||||
:input-debounce="0"
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
import { ref, computed, onMounted } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate, toPercentage } from 'src/filters';
|
||||
import { toDateHourMinSec, toPercentage } from 'src/filters';
|
||||
import { useState } from 'src/composables/useState';
|
||||
import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
|
||||
import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue';
|
||||
|
@ -42,7 +42,7 @@ function stateColor(code) {
|
|||
const data = ref(useCardDescription());
|
||||
const setData = (entity) => {
|
||||
if (!entity) return;
|
||||
data.value = useCardDescription(entity.client.name, entity.id);
|
||||
data.value = useCardDescription(entity?.client?.name, entity.id);
|
||||
state.set('ClaimDescriptor', entity);
|
||||
};
|
||||
onMounted(async () => {
|
||||
|
@ -52,7 +52,6 @@ onMounted(async () => {
|
|||
|
||||
<template>
|
||||
<CardDescriptor
|
||||
ref="descriptor"
|
||||
:url="`Claims/${entityId}`"
|
||||
:filter="filter"
|
||||
module="Claim"
|
||||
|
@ -64,7 +63,7 @@ onMounted(async () => {
|
|||
<ClaimDescriptorMenu :claim="entity" />
|
||||
</template>
|
||||
<template #body="{ entity }">
|
||||
<VnLv v-if="entity.claimState" :label="t('claim.card.state')">
|
||||
<VnLv v-if="entity.claimState" :label="t('claim.state')">
|
||||
<template #value>
|
||||
<QBadge
|
||||
:color="stateColor(entity.claimState.code)"
|
||||
|
@ -75,8 +74,8 @@ onMounted(async () => {
|
|||
</QBadge>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('claim.card.created')" :value="toDate(entity.created)" />
|
||||
<VnLv :label="t('claim.card.commercial')">
|
||||
<VnLv :label="t('claim.created')" :value="toDateHourMinSec(entity.created)" />
|
||||
<VnLv :label="t('claim.commercial')">
|
||||
<template #value>
|
||||
<VnUserLink
|
||||
:name="entity.client?.salesPersonUser?.name"
|
||||
|
@ -86,17 +85,17 @@ onMounted(async () => {
|
|||
</VnLv>
|
||||
<VnLv
|
||||
v-if="entity.worker"
|
||||
:label="t('claim.card.attendedBy')"
|
||||
:label="t('claim.attendedBy')"
|
||||
:value="entity.worker.user.name"
|
||||
>
|
||||
<template #value>
|
||||
<VnUserLink
|
||||
:name="entity.worker.user.nickname"
|
||||
:name="entity.worker.user.name"
|
||||
:worker-id="entity.worker.id"
|
||||
/>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('claim.card.zone')">
|
||||
<VnLv :label="t('claim.zone')">
|
||||
<template #value>
|
||||
<span class="link">
|
||||
{{ entity.ticket?.zone?.name }}
|
||||
|
@ -105,10 +104,10 @@ onMounted(async () => {
|
|||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
:label="t('claim.card.province')"
|
||||
:label="t('claim.province')"
|
||||
:value="entity.ticket?.address?.province?.name"
|
||||
/>
|
||||
<VnLv :label="t('claim.card.ticketId')">
|
||||
<VnLv :label="t('claim.ticketId')">
|
||||
<template #value>
|
||||
<span class="link">
|
||||
{{ entity.ticketFk }}
|
||||
|
@ -130,7 +129,7 @@ onMounted(async () => {
|
|||
color="primary"
|
||||
:to="{ name: 'CustomerCard', params: { id: entity.clientFk } }"
|
||||
>
|
||||
<QTooltip>{{ t('claim.card.customerSummary') }}</QTooltip>
|
||||
<QTooltip>{{ t('claim.customerSummary') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
size="md"
|
||||
|
@ -138,7 +137,7 @@ onMounted(async () => {
|
|||
color="primary"
|
||||
:to="{ name: 'TicketCard', params: { id: entity.ticketFk } }"
|
||||
>
|
||||
<QTooltip>{{ t('claim.card.claimedTicket') }}</QTooltip>
|
||||
<QTooltip>{{ t('claim.claimedTicket') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
size="md"
|
||||
|
@ -146,7 +145,7 @@ onMounted(async () => {
|
|||
color="primary"
|
||||
:href="salixUrl + 'ticket/' + entity.ticketFk + '/sale-tracking'"
|
||||
>
|
||||
<QTooltip>{{ t('claim.card.saleTracking') }}</QTooltip>
|
||||
<QTooltip>{{ t('claim.saleTracking') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
size="md"
|
||||
|
@ -154,7 +153,7 @@ onMounted(async () => {
|
|||
color="primary"
|
||||
:href="salixUrl + 'ticket/' + entity.ticketFk + '/tracking/index'"
|
||||
>
|
||||
<QTooltip>{{ t('claim.card.ticketTracking') }}</QTooltip>
|
||||
<QTooltip>{{ t('claim.ticketTracking') }}</QTooltip>
|
||||
</QBtn>
|
||||
</QCardActions>
|
||||
</template>
|
||||
|
|
|
@ -9,7 +9,7 @@ const state = useState();
|
|||
const user = state.getUser();
|
||||
|
||||
const $props = defineProps({
|
||||
id: { type: Number, default: null },
|
||||
id: { type: [Number, String], default: null },
|
||||
addNote: { type: Boolean, default: true },
|
||||
});
|
||||
const claimId = computed(() => $props.id || route.params.id);
|
||||
|
|
|
@ -18,7 +18,7 @@ const claimId = computed(() => router.currentRoute.value.params.id);
|
|||
|
||||
const claimDms = ref([
|
||||
{
|
||||
dmsFk: 1,
|
||||
dmsFk: claimId,
|
||||
},
|
||||
]);
|
||||
const client = ref({});
|
||||
|
@ -113,7 +113,7 @@ async function create() {
|
|||
warehouseId: config.value.warehouseFk,
|
||||
companyId: config.value.companyFk,
|
||||
dmsTypeId: dmsType.value.id,
|
||||
description: t('claim.photo.fileDescription', {
|
||||
description: t('claim.fileDescription', {
|
||||
claimId: claimId.value,
|
||||
clientName: client.value.name,
|
||||
clientId: client.value.id,
|
||||
|
@ -177,7 +177,7 @@ function onDrag() {
|
|||
>
|
||||
<QIcon size="xl" name="file_download" />
|
||||
<h5>
|
||||
{{ t('claim.photo.dragDrop') }}
|
||||
{{ t('claim.dragDrop') }}
|
||||
</h5>
|
||||
</div>
|
||||
<div
|
||||
|
@ -188,7 +188,7 @@ function onDrag() {
|
|||
<QIcon size="xl" name="image"></QIcon>
|
||||
<QIcon size="xl" name="movie"></QIcon>
|
||||
<h5>
|
||||
{{ t('claim.photo.noData') }}
|
||||
{{ t('claim.noData') }}
|
||||
</h5>
|
||||
</div>
|
||||
<div class="multimediaParent bg-transparent" v-if="claimDms?.length && !dragFile">
|
||||
|
|
|
@ -1,20 +1,25 @@
|
|||
<script setup>
|
||||
import axios from 'axios';
|
||||
import { onMounted, ref, computed } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate, toCurrency } from 'src/filters';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import dashIfEmpty from 'src/filters/dashIfEmpty';
|
||||
import { getUrl } from 'src/composables/getUrl';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import ClaimNotes from 'src/pages/Claim/Card/ClaimNotes.vue';
|
||||
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
||||
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||
import VnTitle from 'src/components/common/VnTitle.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
|
||||
import ClaimSummaryAction from 'src/pages/Claim/Card/ClaimSummaryAction.vue';
|
||||
import ClaimNotes from 'src/pages/Claim/Card/ClaimNotes.vue';
|
||||
|
||||
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import axios from 'axios';
|
||||
import dashIfEmpty from 'src/filters/dashIfEmpty';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
@ -34,6 +39,9 @@ const ClaimStates = ref([]);
|
|||
const claimUrl = ref();
|
||||
const salixUrl = ref();
|
||||
const claimDmsRef = ref();
|
||||
const claimDms = ref([]);
|
||||
const multimediaDialog = ref();
|
||||
const multimediaSlide = ref();
|
||||
const claimDmsFilter = ref({
|
||||
include: [
|
||||
{
|
||||
|
@ -42,34 +50,29 @@ const claimDmsFilter = ref({
|
|||
],
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
salixUrl.value = await getUrl('');
|
||||
claimUrl.value = salixUrl.value + `claim/${entityId.value}/`;
|
||||
});
|
||||
|
||||
const detailsColumns = ref([
|
||||
{
|
||||
name: 'item',
|
||||
label: 'claim.summary.item',
|
||||
label: 'claim.item',
|
||||
field: (row) => row.sale.itemFk,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'landed',
|
||||
label: 'claim.summary.landed',
|
||||
label: 'claim.landed',
|
||||
field: (row) => row.sale.ticket.landed,
|
||||
format: (value) => toDate(value),
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'quantity',
|
||||
label: 'claim.summary.quantity',
|
||||
label: 'claim.quantity',
|
||||
field: (row) => row.sale.quantity,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'claimed',
|
||||
label: 'claim.summary.claimed',
|
||||
label: 'claim.claimed',
|
||||
field: (row) => row.quantity,
|
||||
sortable: true,
|
||||
},
|
||||
|
@ -80,32 +83,38 @@ const detailsColumns = ref([
|
|||
},
|
||||
{
|
||||
name: 'price',
|
||||
label: 'claim.summary.price',
|
||||
label: 'claim.price',
|
||||
field: (row) => row.sale.price,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'discount',
|
||||
label: 'claim.summary.discount',
|
||||
label: 'claim.discount',
|
||||
field: (row) => row.sale.discount,
|
||||
format: (value) => `${value} %`,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'total',
|
||||
label: 'claim.summary.total',
|
||||
label: 'claim.total',
|
||||
field: ({ sale }) =>
|
||||
toCurrency(sale.quantity * sale.price * ((100 - sale.discount) / 100)),
|
||||
sortable: true,
|
||||
},
|
||||
]);
|
||||
|
||||
const markerLabels = [
|
||||
{ value: 1, label: t('claim.company') },
|
||||
{ value: 5, label: t('claim.person') },
|
||||
];
|
||||
|
||||
const STATE_COLOR = {
|
||||
pending: 'warning',
|
||||
incomplete: 'info',
|
||||
resolved: 'positive',
|
||||
canceled: 'negative',
|
||||
};
|
||||
|
||||
function stateColor(code) {
|
||||
return STATE_COLOR[code];
|
||||
}
|
||||
|
@ -113,38 +122,40 @@ function stateColor(code) {
|
|||
const developmentColumns = ref([
|
||||
{
|
||||
name: 'claimReason',
|
||||
label: 'claim.summary.reason',
|
||||
label: 'claim.reason',
|
||||
field: (row) => row.claimReason.description,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'claimResult',
|
||||
label: 'claim.summary.result',
|
||||
label: 'claim.result',
|
||||
field: (row) => row.claimResult.description,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'claimResponsible',
|
||||
label: 'claim.summary.responsible',
|
||||
label: 'claim.responsible',
|
||||
field: (row) => row.claimResponsible.description,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'worker',
|
||||
label: 'claim.summary.worker',
|
||||
label: 'claim.worker',
|
||||
field: (row) => row.worker?.user.nickname,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'claimRedelivery',
|
||||
label: 'claim.summary.redelivery',
|
||||
label: 'claim.redelivery',
|
||||
field: (row) => row.claimRedelivery.description,
|
||||
sortable: true,
|
||||
},
|
||||
]);
|
||||
const claimDms = ref([]);
|
||||
const multimediaDialog = ref();
|
||||
const multimediaSlide = ref();
|
||||
|
||||
onMounted(async () => {
|
||||
salixUrl.value = await getUrl('');
|
||||
claimUrl.value = salixUrl.value + `claim/${entityId.value}/`;
|
||||
});
|
||||
|
||||
async function getClaimDms() {
|
||||
claimDmsFilter.value.where = { claimFk: entityId.value };
|
||||
|
@ -200,7 +211,7 @@ async function changeState(value) {
|
|||
>
|
||||
<QList>
|
||||
<QVirtualScroll
|
||||
style="max-height: 300px"
|
||||
class="max-container-height"
|
||||
:items="ClaimStates"
|
||||
separator
|
||||
v-slot="{ item, index }"
|
||||
|
@ -221,16 +232,13 @@ async function changeState(value) {
|
|||
</QBtnDropdown>
|
||||
</template>
|
||||
<template #body="{ entity: { claim, salesClaimed, developments } }">
|
||||
<QCard class="vn-one">
|
||||
<QCard class="vn-one" v-if="$route.name != 'ClaimSummary'">
|
||||
<VnTitle
|
||||
:url="`#/claim/${entityId}/basic-data`"
|
||||
:text="t('globals.pageTitles.basicData')"
|
||||
/>
|
||||
<VnLv
|
||||
:label="t('claim.summary.created')"
|
||||
:value="toDate(claim.created)"
|
||||
/>
|
||||
<VnLv :label="t('claim.summary.state')">
|
||||
<VnLv :label="t('claim.created')" :value="toDate(claim.created)" />
|
||||
<VnLv :label="t('claim.state')">
|
||||
<template #value>
|
||||
<QChip :color="stateColor(claim.claimState.code)" dense>
|
||||
{{ claim.claimState.description }}
|
||||
|
@ -245,7 +253,7 @@ async function changeState(value) {
|
|||
/>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('claim.summary.attendedBy')">
|
||||
<VnLv :label="t('claim.attendedBy')">
|
||||
<template #value>
|
||||
<VnUserLink
|
||||
:name="claim.worker?.user?.nickname"
|
||||
|
@ -253,7 +261,7 @@ async function changeState(value) {
|
|||
/>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('claim.summary.customer')">
|
||||
<VnLv :label="t('claim.customer')">
|
||||
<template #value>
|
||||
<span class="link cursor-pointer">
|
||||
{{ claim.client?.name }}
|
||||
|
@ -262,27 +270,63 @@ async function changeState(value) {
|
|||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
:label="t('claim.basicData.pickup')"
|
||||
:label="t('claim.pickup')"
|
||||
:value="`${dashIfEmpty(claim.pickup)}`"
|
||||
/>
|
||||
</QCard>
|
||||
<QCard class="vn-three">
|
||||
<VnTitle
|
||||
:url="`#/claim/${entityId}/notes`"
|
||||
:text="t('claim.summary.notes')"
|
||||
/>
|
||||
<QCard class="vn-two">
|
||||
<VnTitle :url="`#/claim/${entityId}/notes`" :text="t('claim.notes')" />
|
||||
<ClaimNotes
|
||||
:id="entityId"
|
||||
:add-note="false"
|
||||
style="max-height: 300px"
|
||||
class="max-container-height"
|
||||
order="created ASC"
|
||||
/>
|
||||
</QCard>
|
||||
<QCard class="vn-two" v-if="salesClaimed.length > 0">
|
||||
<VnTitle
|
||||
:url="`#/claim/${entityId}/lines`"
|
||||
:text="t('claim.summary.details')"
|
||||
/>
|
||||
<QCard class="vn-two" v-if="claimDms?.length">
|
||||
<VnTitle :url="`#/claim/${entityId}/photos`" :text="t('claim.photos')" />
|
||||
<div class="container max-container-height" style="overflow: auto">
|
||||
<div
|
||||
class="multimedia-container"
|
||||
v-for="(media, index) of claimDms"
|
||||
:key="index"
|
||||
>
|
||||
<div class="relative-position">
|
||||
<QIcon
|
||||
name="play_circle"
|
||||
color="primary"
|
||||
size="xl"
|
||||
class="absolute-center zindex"
|
||||
v-if="media.isVideo"
|
||||
@click.stop="openDialog(media.dmsFk)"
|
||||
>
|
||||
<QTooltip>Video</QTooltip>
|
||||
</QIcon>
|
||||
<QCard
|
||||
class="multimedia relative-position"
|
||||
style="max-height: 128px"
|
||||
>
|
||||
<QImg
|
||||
:src="media.url"
|
||||
class="rounded-borders cursor-pointer fit"
|
||||
@click="openDialog(media.dmsFk)"
|
||||
v-if="!media.isVideo"
|
||||
>
|
||||
</QImg>
|
||||
<video
|
||||
:src="media.url"
|
||||
class="rounded-borders cursor-pointer fit"
|
||||
muted="muted"
|
||||
v-if="media.isVideo"
|
||||
@click="openDialog(media.dmsFk)"
|
||||
/>
|
||||
</QCard>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</QCard>
|
||||
<QCard class="vn-max" v-if="salesClaimed.length > 0">
|
||||
<VnTitle :url="`#/claim/${entityId}/lines`" :text="t('claim.details')" />
|
||||
<QTable
|
||||
:columns="detailsColumns"
|
||||
:rows="salesClaimed"
|
||||
|
@ -320,53 +364,8 @@ async function changeState(value) {
|
|||
</template>
|
||||
</QTable>
|
||||
</QCard>
|
||||
<QCard class="vn-two" v-if="claimDms.length > 0">
|
||||
<VnTitle
|
||||
:url="`#/claim/${entityId}/photos`"
|
||||
:text="t('claim.summary.photos')"
|
||||
/>
|
||||
<div class="container">
|
||||
<div
|
||||
class="multimedia-container"
|
||||
v-for="(media, index) of claimDms"
|
||||
:key="index"
|
||||
>
|
||||
<div class="relative-position">
|
||||
<QIcon
|
||||
name="play_circle"
|
||||
color="primary"
|
||||
size="xl"
|
||||
class="absolute-center zindex"
|
||||
v-if="media.isVideo"
|
||||
@click.stop="openDialog(media.dmsFk)"
|
||||
>
|
||||
<QTooltip>Video</QTooltip>
|
||||
</QIcon>
|
||||
<QCard class="multimedia relative-position">
|
||||
<QImg
|
||||
:src="media.url"
|
||||
class="rounded-borders cursor-pointer fit"
|
||||
@click="openDialog(media.dmsFk)"
|
||||
v-if="!media.isVideo"
|
||||
>
|
||||
</QImg>
|
||||
<video
|
||||
:src="media.url"
|
||||
class="rounded-borders cursor-pointer fit"
|
||||
muted="muted"
|
||||
v-if="media.isVideo"
|
||||
@click="openDialog(media.dmsFk)"
|
||||
/>
|
||||
</QCard>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</QCard>
|
||||
<QCard class="vn-two" v-if="developments.length > 0">
|
||||
<VnTitle
|
||||
:url="claimUrl + 'development'"
|
||||
:text="t('claim.summary.development')"
|
||||
/>
|
||||
<QCard class="vn-max" v-if="developments.length > 0">
|
||||
<VnTitle :url="claimUrl + 'development'" :text="t('claim.development')" />
|
||||
<QTable
|
||||
:columns="developmentColumns"
|
||||
:rows="developments"
|
||||
|
@ -382,27 +381,31 @@ async function changeState(value) {
|
|||
</QTh>
|
||||
</QTr>
|
||||
</template>
|
||||
<template #body-cell-worker="props">
|
||||
<QTd :props="props" class="link">
|
||||
{{ props.value }}
|
||||
<WorkerDescriptorProxy :id="props.row.worker.id" />
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</QCard>
|
||||
<QCard class="vn-max">
|
||||
<VnTitle :url="claimUrl + 'action'" :text="t('claim.summary.actions')" />
|
||||
<VnTitle :url="claimUrl + 'action'" :text="t('claim.actions')" />
|
||||
<div id="slider-container" class="q-px-xl q-py-md">
|
||||
<QSlider
|
||||
v-model="claim.responsibility"
|
||||
label
|
||||
:label-value="t('claim.summary.responsibility')"
|
||||
:label-value="t('claim.responsibility')"
|
||||
label-always
|
||||
color="var()"
|
||||
markers
|
||||
:marker-labels="[
|
||||
{ value: 1, label: t('claim.summary.company') },
|
||||
{ value: 5, label: t('claim.summary.person') },
|
||||
]"
|
||||
:marker-labels="markerLabels"
|
||||
:min="1"
|
||||
:max="5"
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
<ClaimSummaryAction :id="entityId" />
|
||||
</QCard>
|
||||
<QDialog
|
||||
v-model="multimediaDialog"
|
||||
|
@ -458,7 +461,7 @@ async function changeState(value) {
|
|||
gap: 15px;
|
||||
}
|
||||
.multimedia-container {
|
||||
flex: 1 0 21%;
|
||||
flex: 0 0 128px;
|
||||
}
|
||||
.multimedia {
|
||||
transition: all 0.5s;
|
||||
|
@ -491,4 +494,8 @@ async function changeState(value) {
|
|||
.change-state {
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
.max-container-height {
|
||||
max-height: 300px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -0,0 +1,97 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate, toPercentage } from 'filters/index';
|
||||
import VnTable from 'src/components/VnTable/VnTable.vue';
|
||||
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||
import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
type: [Number, String],
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const columns = [
|
||||
{
|
||||
name: 'itemFk',
|
||||
label: t('Id item'),
|
||||
columnFilter: false,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'ticketFk',
|
||||
label: t('Ticket'),
|
||||
columnFilter: false,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'claimDestinationFk',
|
||||
label: t('Destination'),
|
||||
columnFilter: false,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'landed',
|
||||
label: t('Landed'),
|
||||
format: (row) => toDate(row.landed),
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'quantity',
|
||||
label: t('Quantity'),
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'concept',
|
||||
label: t('Description'),
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'price',
|
||||
label: t('Price'),
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'discount',
|
||||
label: t('Discount'),
|
||||
format: ({ discount }) => toPercentage(discount / 100),
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'total',
|
||||
label: t('Total'),
|
||||
align: 'left',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
<template>
|
||||
<VnTable
|
||||
data-key="ClaimEndsTable"
|
||||
url="ClaimEnds/filter"
|
||||
:right-search="false"
|
||||
:column-search="false"
|
||||
:disable-option="{ card: true, table: true }"
|
||||
search-url="actions"
|
||||
:filter="{ where: { claimFk: $props.id } }"
|
||||
:columns="columns"
|
||||
:limit="0"
|
||||
:without-header="true"
|
||||
auto-load
|
||||
>
|
||||
<template #column-itemFk="{ row }">
|
||||
<span class="link">
|
||||
{{ row.itemFk }}
|
||||
<ItemDescriptorProxy :id="row.itemFk" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-ticketFk="{ row }">
|
||||
<span class="link">
|
||||
{{ row.ticketFk }}
|
||||
<TicketDescriptorProxy :id="row.ticketFk" />
|
||||
</span>
|
||||
</template>
|
||||
</VnTable>
|
||||
</template>
|
|
@ -16,19 +16,14 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const workers = ref();
|
||||
const states = ref();
|
||||
const states = ref([]);
|
||||
|
||||
defineExpose({ states });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData url="ClaimStates" @on-fetch="(data) => (states = data)" auto-load />
|
||||
<FetchData
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
@on-fetch="(data) => (workers = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
|
||||
<template #tags="{ tag, formatFn }">
|
||||
<div class="q-gutter-x-xs">
|
||||
<strong>{{ t(`params.${tag.label}`) }}: </strong>
|
||||
|
@ -36,156 +31,110 @@ const states = ref();
|
|||
</div>
|
||||
</template>
|
||||
<template #body="{ params, searchFn }">
|
||||
<QItem class="q-my-sm">
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
:label="t('Customer ID')"
|
||||
v-model="params.clientFk"
|
||||
lazy-rules
|
||||
is-outlined
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="badge" size="xs"></QIcon> </template
|
||||
></VnInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem class="q-mb-sm">
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
:label="t('Client Name')"
|
||||
v-model="params.clientName"
|
||||
lazy-rules
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem class="q-mb-sm">
|
||||
<QItemSection v-if="!workers">
|
||||
<QSkeleton type="QInput" class="full-width" />
|
||||
</QItemSection>
|
||||
<QItemSection v-if="workers">
|
||||
<VnSelect
|
||||
:label="t('Salesperson')"
|
||||
v-model="params.salesPersonFk"
|
||||
@update:model-value="searchFn()"
|
||||
:options="workers"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
use-input
|
||||
hide-selected
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
:input-debounce="0"
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem class="q-mb-sm">
|
||||
<QItemSection v-if="!workers">
|
||||
<QSkeleton type="QInput" class="full-width" />
|
||||
</QItemSection>
|
||||
<QItemSection v-if="workers">
|
||||
<VnSelect
|
||||
:label="t('Attender')"
|
||||
v-model="params.attenderFk"
|
||||
@update:model-value="searchFn()"
|
||||
:options="workers"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
use-input
|
||||
hide-selected
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
:input-debounce="0"
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem class="q-mb-sm">
|
||||
<QItemSection v-if="!workers">
|
||||
<QSkeleton type="QInput" class="full-width" />
|
||||
</QItemSection>
|
||||
<QItemSection v-if="workers">
|
||||
<VnSelect
|
||||
:label="t('Responsible')"
|
||||
v-model="params.claimResponsibleFk"
|
||||
@update:model-value="searchFn()"
|
||||
:options="workers"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
use-input
|
||||
hide-selected
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
:input-debounce="0"
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem class="q-mb-sm">
|
||||
<QItemSection v-if="!states">
|
||||
<QSkeleton type="QInput" class="full-width" />
|
||||
</QItemSection>
|
||||
<QItemSection v-if="states">
|
||||
<VnSelect
|
||||
:label="t('State')"
|
||||
v-model="params.claimStateFk"
|
||||
@update:model-value="searchFn()"
|
||||
:options="states"
|
||||
option-value="id"
|
||||
option-label="description"
|
||||
emit-value
|
||||
map-options
|
||||
hide-selected
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QCheckbox
|
||||
v-model="params.myTeam"
|
||||
:label="t('myTeam')"
|
||||
toggle-indeterminate
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QSeparator />
|
||||
<QExpansionItem :label="t('More options')" expand-separator>
|
||||
<!-- <QItem>
|
||||
<QItemSection>
|
||||
<qSelect
|
||||
:label="t('Item')"
|
||||
v-model="params.itemFk"
|
||||
:options="items"
|
||||
:loading="loading"
|
||||
@filter="filterFn"
|
||||
@virtual-scroll="onScroll"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem> -->
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate
|
||||
v-model="params.created"
|
||||
:label="t('Created')"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QExpansionItem>
|
||||
<div class="q-pa-sm q-gutter-y-sm">
|
||||
<VnInput
|
||||
:label="t('claim.customerId')"
|
||||
v-model="params.clientFk"
|
||||
lazy-rules
|
||||
is-outlined
|
||||
>
|
||||
<template #prepend> <QIcon name="badge" size="xs" /></template>
|
||||
</VnInput>
|
||||
<VnInput
|
||||
:label="t('Client Name')"
|
||||
v-model="params.clientName"
|
||||
lazy-rules
|
||||
is-outlined
|
||||
/>
|
||||
<VnSelect
|
||||
:label="t('Salesperson')"
|
||||
v-model="params.salesPersonFk"
|
||||
@update:model-value="searchFn()"
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
:use-like="false"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
option-filter="firstName"
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
/>
|
||||
<VnSelect
|
||||
:label="t('claim.attendedBy')"
|
||||
v-model="params.attenderFk"
|
||||
@update:model-value="searchFn()"
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
:use-like="false"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
option-filter="firstName"
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
/>
|
||||
<VnSelect
|
||||
:label="t('claim.state')"
|
||||
v-model="params.claimStateFk"
|
||||
@update:model-value="searchFn()"
|
||||
:options="states"
|
||||
option-value="id"
|
||||
option-label="description"
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
/>
|
||||
<VnInputDate
|
||||
v-model="params.created"
|
||||
@update:model-value="searchFn()"
|
||||
:label="t('claim.created')"
|
||||
outlined
|
||||
rounded
|
||||
dense
|
||||
/>
|
||||
<VnSelect
|
||||
:label="t('Item')"
|
||||
v-model="params.itemFk"
|
||||
@update:model-value="searchFn()"
|
||||
url="Items/withName"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
sort-by="id DESC"
|
||||
outlined
|
||||
rounded
|
||||
dense
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
<QItemSection>
|
||||
<QItemLabel> #{{ scope.opt?.id }} </QItemLabel>
|
||||
<QItemLabel caption>{{ scope.opt?.name }}</QItemLabel>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
</VnSelect>
|
||||
<VnSelect
|
||||
:label="t('claim.responsible')"
|
||||
v-model="params.claimResponsibleFk"
|
||||
@update:model-value="searchFn()"
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
:use-like="false"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
option-filter="firstName"
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
/>
|
||||
<QCheckbox
|
||||
v-model="params.myTeam"
|
||||
:label="t('params.myTeam')"
|
||||
@update:model-value="searchFn()"
|
||||
toggle-indeterminate
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</VnFilterPanel>
|
||||
</template>
|
||||
|
@ -201,7 +150,8 @@ en:
|
|||
claimResponsibleFk: Responsible
|
||||
claimStateFk: State
|
||||
created: Created
|
||||
myTeam: My team
|
||||
myTeam: My team
|
||||
itemFk: Item
|
||||
es:
|
||||
params:
|
||||
search: Contiene
|
||||
|
@ -212,14 +162,9 @@ es:
|
|||
claimResponsibleFk: Responsable
|
||||
claimStateFk: Estado
|
||||
created: Creada
|
||||
Customer ID: ID cliente
|
||||
myTeam: Mi equipo
|
||||
itemFk: Artículo
|
||||
Client Name: Nombre del cliente
|
||||
Salesperson: Comercial
|
||||
Attender: Asistente
|
||||
Responsible: Responsable
|
||||
State: Estado
|
||||
Item: Artículo
|
||||
Created: Creada
|
||||
More options: Más opciones
|
||||
myTeam: Mi equipo
|
||||
</i18n>
|
||||
|
|
|
@ -1,38 +1,114 @@
|
|||
<script setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { toDate } from 'filters/index';
|
||||
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import ClaimFilter from './ClaimFilter.vue';
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import CardList from 'src/components/ui/CardList.vue';
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
||||
import ClaimSummary from './Card/ClaimSummary.vue';
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||
import VnTable from 'src/components/VnTable/VnTable.vue';
|
||||
|
||||
const router = useRouter();
|
||||
const { t } = useI18n();
|
||||
const { viewSummary } = useSummaryDialog();
|
||||
|
||||
const claimFilterRef = ref();
|
||||
const columns = computed(() => [
|
||||
{
|
||||
align: 'left',
|
||||
name: 'id',
|
||||
label: t('customer.extendedList.tableVisibleColumns.id'),
|
||||
chip: {
|
||||
condition: () => true,
|
||||
},
|
||||
isId: true,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
label: t('customer.extendedList.tableVisibleColumns.name'),
|
||||
name: 'clientName',
|
||||
isTitle: true,
|
||||
visible: false,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
label: t('claim.customer'),
|
||||
name: 'clientFk',
|
||||
cardVisible: true,
|
||||
columnFilter: {
|
||||
component: 'select',
|
||||
attrs: {
|
||||
url: 'Clients',
|
||||
fields: ['id', 'name'],
|
||||
},
|
||||
},
|
||||
class: 'expand',
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
label: t('claim.attendedBy'),
|
||||
name: 'attendedBy',
|
||||
cardVisible: true,
|
||||
columnFilter: {
|
||||
component: 'select',
|
||||
attrs: {
|
||||
url: 'Workers/activeWithInheritedRole',
|
||||
fields: ['id', 'name'],
|
||||
where: { role: 'salesPerson' },
|
||||
useLike: false,
|
||||
optionValue: 'id',
|
||||
optionLabel: 'name',
|
||||
optionFilter: 'firstName',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
label: t('claim.created'),
|
||||
name: 'created',
|
||||
format: ({ created }) => toDate(created),
|
||||
cardVisible: true,
|
||||
columnFilter: {
|
||||
component: 'date',
|
||||
},
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
label: t('claim.state'),
|
||||
name: 'stateCode',
|
||||
chip: {
|
||||
condition: () => true,
|
||||
color: ({ stateCode }) => STATE_COLOR[stateCode] ?? 'bg-grey',
|
||||
},
|
||||
columnFilter: {
|
||||
name: 'claimStateFk',
|
||||
component: 'select',
|
||||
attrs: {
|
||||
options: claimFilterRef.value?.states,
|
||||
optionLabel: 'description',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
align: 'right',
|
||||
name: 'tableActions',
|
||||
actions: [
|
||||
{
|
||||
title: t('Client ticket list'),
|
||||
icon: 'preview',
|
||||
action: (row) => viewSummary(row.id, ClaimSummary),
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
const STATE_COLOR = {
|
||||
pending: 'warning',
|
||||
managed: 'info',
|
||||
resolved: 'positive',
|
||||
pending: 'bg-warning',
|
||||
managed: 'bg-info',
|
||||
resolved: 'bg-positive',
|
||||
};
|
||||
function getApiUrl() {
|
||||
return new URL(window.location).origin;
|
||||
}
|
||||
function stateColor(code) {
|
||||
return STATE_COLOR[code];
|
||||
}
|
||||
function navigate(event, id) {
|
||||
if (event.ctrlKey || event.metaKey)
|
||||
return window.open(`${getApiUrl()}/#/claim/${id}/summary`);
|
||||
router.push({ path: `/claim/${id}` });
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -43,85 +119,39 @@ function navigate(event, id) {
|
|||
/>
|
||||
<RightMenu>
|
||||
<template #right-panel>
|
||||
<ClaimFilter data-key="ClaimList" />
|
||||
<ClaimFilter data-key="ClaimList" ref="claimFilterRef" />
|
||||
</template>
|
||||
</RightMenu>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<div class="vn-card-list">
|
||||
<VnPaginate
|
||||
data-key="ClaimList"
|
||||
url="Claims/filter"
|
||||
:order="['priority ASC', 'created DESC']"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<CardList
|
||||
:id="row.id"
|
||||
:key="row.id"
|
||||
:title="row.clientName"
|
||||
@click="navigate($event, row.id)"
|
||||
v-for="row of rows"
|
||||
>
|
||||
<template #list-items>
|
||||
<VnLv :label="t('claim.list.customer')">
|
||||
<template #value>
|
||||
<span class="link" @click.stop>
|
||||
{{ row.clientName }}
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</span>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('claim.list.assignedTo')">
|
||||
<template #value>
|
||||
<span @click.stop>
|
||||
<VnUserLink
|
||||
:name="row.workerName"
|
||||
:worker-id="row.workerFk"
|
||||
/>
|
||||
</span>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
:label="t('claim.list.created')"
|
||||
:value="toDate(row.created)"
|
||||
/>
|
||||
<VnLv :label="t('claim.list.state')">
|
||||
<template #value>
|
||||
<QBadge
|
||||
text-color="black"
|
||||
:color="stateColor(row.stateCode)"
|
||||
dense
|
||||
>
|
||||
{{ row.stateDescription }}
|
||||
</QBadge>
|
||||
</template>
|
||||
</VnLv>
|
||||
</template>
|
||||
<template #actions>
|
||||
<QBtn
|
||||
:label="t('globals.description')"
|
||||
@click.stop
|
||||
outline
|
||||
style="margin-top: 15px"
|
||||
>
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</QBtn>
|
||||
<QBtn
|
||||
:label="t('components.smartCard.openSummary')"
|
||||
@click.stop="viewSummary(row.id, ClaimSummary)"
|
||||
color="primary"
|
||||
style="margin-top: 15px"
|
||||
/>
|
||||
</template>
|
||||
</CardList>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
</QPage>
|
||||
<VnTable
|
||||
data-key="ClaimList"
|
||||
url="Claims/filter"
|
||||
:order="['priority ASC', 'created DESC']"
|
||||
:columns="columns"
|
||||
redirect="claim"
|
||||
:right-search="false"
|
||||
auto-load
|
||||
>
|
||||
<template #column-clientFk="{ row }">
|
||||
<span class="link" @click.stop>
|
||||
{{ row.clientName }}
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</span>
|
||||
</template>
|
||||
<template #column-attendedBy="{ row }">
|
||||
<span @click.stop>
|
||||
<VnUserLink :name="row.workerName" :worker-id="row.workerFk" />
|
||||
</span>
|
||||
</template>
|
||||
</VnTable>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search claim: Buscar reclamación
|
||||
You can search by claim id or customer name: Puedes buscar por id de la reclamación o nombre del cliente
|
||||
params:
|
||||
stateCode: Estado
|
||||
en:
|
||||
params:
|
||||
stateCode: State
|
||||
</i18n>
|
||||
|
|
|
@ -0,0 +1,46 @@
|
|||
claim:
|
||||
customer: Customer
|
||||
code: Code
|
||||
records: records
|
||||
claimId: Claim ID
|
||||
attendedBy: Attended by
|
||||
ticketId: Ticket ID
|
||||
customerSummary: Customer summary
|
||||
claimedTicket: Claimed ticket
|
||||
saleTracking: Sale tracking
|
||||
ticketTracking: Ticket tracking
|
||||
commercial: Commercial
|
||||
province: Province
|
||||
zone: Zone
|
||||
customerId: client ID
|
||||
assignedTo: Assigned
|
||||
created: Created
|
||||
details: Details
|
||||
item: Item
|
||||
landed: Landed
|
||||
quantity: Quantity
|
||||
claimed: Claimed
|
||||
price: Price
|
||||
discount: Discount
|
||||
total: Total
|
||||
actions: Actions
|
||||
responsibility: Responsibility
|
||||
company: Company
|
||||
person: Employee/Customer
|
||||
notes: Notes
|
||||
photos: Photos
|
||||
development: Development
|
||||
reason: Reason
|
||||
result: Result
|
||||
responsible: Responsible
|
||||
worker: Worker
|
||||
redelivery: Redelivery
|
||||
changeState: Change state
|
||||
state: State
|
||||
pickup: Pick up
|
||||
null: No
|
||||
agency: Agency
|
||||
delivery: Delivery
|
||||
fileDescription: 'Claim id {claimId} from client {clientName} id {clientId}'
|
||||
noData: 'There are no images/videos, click here or drag and drop the file'
|
||||
dragDrop: Drag and drop it here
|
|
@ -1,2 +1,48 @@
|
|||
Search claim: Buscar reclamación
|
||||
You can search by claim id or customer name: Puedes buscar por id de la reclamación o nombre del cliente
|
||||
claim:
|
||||
customer: Cliente
|
||||
code: Código
|
||||
records: Registros
|
||||
claimId: ID de reclamación
|
||||
attendedBy: Atendido por
|
||||
ticketId: ID de ticket
|
||||
customerSummary: Resumen del cliente
|
||||
claimedTicket: Ticket reclamado
|
||||
saleTracking: Seguimiento de ventas
|
||||
ticketTracking: Seguimiento de tickets
|
||||
commercial: Comercial
|
||||
province: Provincia
|
||||
zone: Zona
|
||||
customerId: ID de cliente
|
||||
assignedTo: Asignado a
|
||||
created: Creado
|
||||
details: Detalles
|
||||
item: Artículo
|
||||
landed: Llegado
|
||||
quantity: Cantidad
|
||||
claimed: Reclamado
|
||||
price: Precio
|
||||
discount: Descuento
|
||||
total: Total
|
||||
actions: Acciones
|
||||
responsibility: Responsabilidad
|
||||
company: Empresa
|
||||
person: Empleado/Cliente
|
||||
notes: Notas
|
||||
photos: Fotos
|
||||
development: Trazabilidad
|
||||
reason: Razón
|
||||
result: Resultado
|
||||
responsible: Responsable
|
||||
worker: Trabajador
|
||||
redelivery: Reentrega
|
||||
changeState: Cambiar estado
|
||||
state: Estado
|
||||
pickup: Recoger
|
||||
null: No
|
||||
agency: Agencia
|
||||
delivery: Entrega
|
||||
fileDescription: 'ID de reclamación {claimId} del cliente {clientName} con ID {clientId}'
|
||||
noData: 'No hay imágenes/videos, haz clic aquí o arrastra y suelta el archivo'
|
||||
dragDrop: Arrastra y suelta aquí
|
||||
|
|
|
@ -32,7 +32,7 @@ const entityId = computed(() => {
|
|||
});
|
||||
|
||||
const data = ref(useCardDescription());
|
||||
const setData = (entity) => (data.value = useCardDescription(entity.name, entity.id));
|
||||
const setData = (entity) => (data.value = useCardDescription(entity?.name, entity?.id));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
|
@ -42,6 +42,9 @@ const columns = computed(() => [
|
|||
name: 'name',
|
||||
isTitle: true,
|
||||
create: true,
|
||||
columnField: {
|
||||
class: 'expand',
|
||||
},
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
|
@ -49,6 +52,9 @@ const columns = computed(() => [
|
|||
label: t('customer.extendedList.tableVisibleColumns.socialName'),
|
||||
isTitle: true,
|
||||
create: true,
|
||||
columnField: {
|
||||
class: 'expand',
|
||||
},
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
|
@ -78,8 +84,8 @@ const columns = computed(() => [
|
|||
align: 'left',
|
||||
label: t('customer.extendedList.tableVisibleColumns.credit'),
|
||||
name: 'credit',
|
||||
component: 'number',
|
||||
columnFilter: {
|
||||
component: 'number',
|
||||
inWhere: true,
|
||||
},
|
||||
},
|
||||
|
@ -87,8 +93,8 @@ const columns = computed(() => [
|
|||
align: 'left',
|
||||
label: t('customer.extendedList.tableVisibleColumns.creditInsurance'),
|
||||
name: 'creditInsurance',
|
||||
component: 'number',
|
||||
columnFilter: {
|
||||
component: 'number',
|
||||
inWhere: true,
|
||||
},
|
||||
},
|
||||
|
@ -130,6 +136,9 @@ const columns = computed(() => [
|
|||
columnFilter: {
|
||||
inWhere: true,
|
||||
},
|
||||
columnField: {
|
||||
class: 'expand',
|
||||
},
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
|
@ -179,8 +188,8 @@ const columns = computed(() => [
|
|||
label: t('customer.extendedList.tableVisibleColumns.created'),
|
||||
name: 'created',
|
||||
format: ({ created }) => toDate(created),
|
||||
component: 'date',
|
||||
columnFilter: {
|
||||
component: 'date',
|
||||
alias: 'c',
|
||||
inWhere: true,
|
||||
},
|
||||
|
@ -405,7 +414,6 @@ function handleLocation(data, location) {
|
|||
}"
|
||||
order="id DESC"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
redirect="customer"
|
||||
auto-load
|
||||
>
|
||||
|
|
|
@ -73,7 +73,7 @@ onMounted(async () => {
|
|||
|
||||
const data = ref(useCardDescription());
|
||||
const setData = (entity) =>
|
||||
(data.value = useCardDescription(entity.supplier.nickname, entity.id));
|
||||
(data.value = useCardDescription(entity.supplier?.nickname, entity.id));
|
||||
|
||||
const currentEntry = computed(() => state.get('entry'));
|
||||
|
||||
|
|
|
@ -191,7 +191,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
order="id DESC"
|
||||
:columns="columns"
|
||||
redirect="entry"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
:right-search="false"
|
||||
/>
|
||||
|
|
|
@ -199,7 +199,6 @@ onMounted(async () => {
|
|||
order="id DESC"
|
||||
:columns="columns"
|
||||
redirect="entry"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
:right-search="false"
|
||||
/>
|
||||
|
|
|
@ -207,7 +207,6 @@ watchEffect(selectedRows);
|
|||
v-model:selected="selectedRows"
|
||||
order="id DESC"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
redirect="invoice-out"
|
||||
auto-load
|
||||
:table="{
|
||||
|
|
|
@ -164,7 +164,6 @@ const downloadCSV = async () => {
|
|||
"
|
||||
:limit="0"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
:is-editable="false"
|
||||
:use-model="true"
|
||||
|
|
|
@ -5,7 +5,9 @@ import { useRoute } from 'vue-router';
|
|||
|
||||
import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue';
|
||||
import EntryDescriptorProxy from 'src/pages/Entry/Card/EntryDescriptorProxy.vue';
|
||||
import OrderDescriptorProxy from 'src/pages/Order/Card/OrderDescriptorProxy.vue';
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||
|
@ -45,8 +47,8 @@ const columns = computed(() => [
|
|||
align: 'left',
|
||||
},
|
||||
{
|
||||
label: t('itemDiary.id'),
|
||||
name: 'id',
|
||||
label: t('itemDiary.origin'),
|
||||
name: 'originId',
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
|
@ -65,8 +67,8 @@ const columns = computed(() => [
|
|||
},
|
||||
|
||||
{
|
||||
label: t('itemDiary.client'),
|
||||
name: 'client',
|
||||
label: t('itemDiary.entity'),
|
||||
name: 'entityId',
|
||||
align: 'left',
|
||||
format: (val) => dashIfEmpty(val),
|
||||
},
|
||||
|
@ -111,10 +113,28 @@ const getBadgeAttrs = (_date) => {
|
|||
return attrs;
|
||||
};
|
||||
|
||||
const getIdDescriptor = (row) => {
|
||||
let descriptor = EntryDescriptorProxy;
|
||||
if (row.isTicket) descriptor = TicketDescriptorProxy;
|
||||
return descriptor;
|
||||
const originTypeMap = {
|
||||
entry: {
|
||||
descriptor: EntryDescriptorProxy,
|
||||
icon: 'vn:entry',
|
||||
},
|
||||
ticket: {
|
||||
descriptor: TicketDescriptorProxy,
|
||||
icon: 'vn:ticket',
|
||||
},
|
||||
order: {
|
||||
descriptor: OrderDescriptorProxy,
|
||||
icon: 'vn:basket',
|
||||
},
|
||||
};
|
||||
|
||||
const entityTypeMap = {
|
||||
client: {
|
||||
descriptor: CustomerDescriptorProxy,
|
||||
},
|
||||
supplier: {
|
||||
descriptor: SupplierDescriptorProxy,
|
||||
},
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
|
@ -206,21 +226,28 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
</QBadge>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-id="{ row }">
|
||||
<template #body-cell-originId="{ row }">
|
||||
<QTd @click.stop>
|
||||
<component
|
||||
:is="getIdDescriptor(row)"
|
||||
:id="row.origin"
|
||||
:is="originTypeMap[row.originType]?.descriptor"
|
||||
:id="row.originId"
|
||||
class="q-ma-none"
|
||||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
{{ row.origin }}
|
||||
{{ row.originId }}
|
||||
</component>
|
||||
<span class="link">{{ row.origin }}</span>
|
||||
<span class="link">
|
||||
<QIcon
|
||||
:name="originTypeMap[row.originType]?.icon"
|
||||
class="fill-icon q-mr-sm"
|
||||
size="xs"
|
||||
/>
|
||||
{{ row.originId }}
|
||||
</span>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-client="{ row }">
|
||||
<template #body-cell-entityId="{ row }">
|
||||
<QTd @click.stop>
|
||||
<QBadge
|
||||
:color="row.highlighted ? 'warning' : 'transparent'"
|
||||
|
@ -228,11 +255,18 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
<span v-if="row.isTicket" class="link">
|
||||
{{ dashIfEmpty(row.name) }}
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
<component
|
||||
:is="entityTypeMap[row.entityType]?.descriptor"
|
||||
:id="row.entityId"
|
||||
class="q-ma-none"
|
||||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
{{ row.entityId }}
|
||||
</component>
|
||||
<span class="link">
|
||||
{{ dashIfEmpty(row.entityName) }}
|
||||
</span>
|
||||
<span v-else>{{ dashIfEmpty(row.name) }}</span>
|
||||
</QBadge>
|
||||
</QTd>
|
||||
</template>
|
||||
|
|
|
@ -135,10 +135,6 @@ const isAdministrative = computed(() => {
|
|||
:label="t('item.summary.nonRecycledPlastic')"
|
||||
:value="item.nonRecycledPlastic"
|
||||
/>
|
||||
<VnLv
|
||||
:label="t('item.summary.minSalesQuantity')"
|
||||
:value="item.minQuantity"
|
||||
/>
|
||||
</QCard>
|
||||
<QCard class="vn-one">
|
||||
<component
|
||||
|
|
|
@ -14,10 +14,10 @@ shelvings:
|
|||
removeConfirmSubtitle: Are you sure you want to continue?
|
||||
itemDiary:
|
||||
date: Date
|
||||
id: Id
|
||||
origin: Origin
|
||||
state: State
|
||||
reference: Reference
|
||||
client: Client
|
||||
entity: Entity
|
||||
in: In
|
||||
out: Out
|
||||
balance: Balance
|
||||
|
|
|
@ -14,10 +14,10 @@ shelvings:
|
|||
removeConfirmSubtitle: ¿Seguro que quieres continuar?
|
||||
itemDiary:
|
||||
date: Fecha
|
||||
id: Id
|
||||
origin: Origen
|
||||
state: Estado
|
||||
reference: Referencia
|
||||
client: Cliente
|
||||
entity: Entidad
|
||||
in: Entrada
|
||||
out: Salida
|
||||
balance: Balance
|
||||
|
|
|
@ -60,7 +60,7 @@ const filter = {
|
|||
const data = ref(useCardDescription());
|
||||
const setData = (entity) => {
|
||||
if (!entity) return;
|
||||
data.value = useCardDescription(entity.client.name, entity.id);
|
||||
data.value = useCardDescription(entity?.client?.name, entity?.id);
|
||||
state.set('OrderDescriptor', entity);
|
||||
};
|
||||
|
||||
|
@ -131,7 +131,7 @@ const total = ref(null);
|
|||
color="primary"
|
||||
:to="{ name: 'CustomerCard', params: { id: entity.clientFk } }"
|
||||
>
|
||||
<QTooltip>{{ t('claim.card.customerSummary') }}</QTooltip>
|
||||
<QTooltip>{{ t('claim.customerSummary') }}</QTooltip>
|
||||
</QBtn>
|
||||
</QCardActions>
|
||||
</template>
|
||||
|
|
|
@ -0,0 +1,17 @@
|
|||
<script setup>
|
||||
import OrderDescriptor from './OrderDescriptor.vue';
|
||||
import OrderSummary from './OrderSummary.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QPopupProxy>
|
||||
<OrderDescriptor v-if="$props.id" :id="$props.id" :summary="OrderSummary" />
|
||||
</QPopupProxy>
|
||||
</template>
|
|
@ -21,9 +21,6 @@ const quasar = useQuasar();
|
|||
const componentKey = ref(0);
|
||||
const tableLinesRef = ref();
|
||||
const order = ref();
|
||||
const refresh = () => {
|
||||
componentKey.value += 1;
|
||||
};
|
||||
const orderSummary = ref({
|
||||
total: null,
|
||||
vat: null,
|
||||
|
@ -66,37 +63,6 @@ const lineFilter = ref({
|
|||
where: { orderFk: route.params.id },
|
||||
});
|
||||
|
||||
function confirmRemove(item) {
|
||||
quasar.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
title: t('confirmDeletion'),
|
||||
message: t('confirmDeletionMessage'),
|
||||
promise: async () => remove(item),
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function remove(item) {
|
||||
await axios.post('OrderRows/removes', {
|
||||
actualOrderId: route.params.id,
|
||||
rows: [item.id],
|
||||
});
|
||||
quasar.notify({
|
||||
message: t('globals.dataDeleted'),
|
||||
type: 'positive',
|
||||
});
|
||||
refresh();
|
||||
}
|
||||
|
||||
async function confirmOrder() {
|
||||
await axios.post(`Orders/${route.params.id}/confirm`);
|
||||
quasar.notify({
|
||||
message: t('globals.confirm'),
|
||||
type: 'positive',
|
||||
});
|
||||
}
|
||||
|
||||
const columns = computed(() => [
|
||||
{
|
||||
align: 'center',
|
||||
|
@ -121,6 +87,7 @@ const columns = computed(() => [
|
|||
condition: () => true,
|
||||
},
|
||||
isId: true,
|
||||
format: (row) => row?.item?.id,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
|
@ -190,12 +157,45 @@ const columns = computed(() => [
|
|||
{
|
||||
title: t('delete'),
|
||||
icon: 'delete',
|
||||
click: (row) => confirmRemove(row.item),
|
||||
action: (row) => confirmRemove(row),
|
||||
isPrimary: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
function confirmRemove(item) {
|
||||
quasar.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
title: t('confirmDeletion'),
|
||||
message: t('confirmDeletionMessage'),
|
||||
promise: async () => remove(item),
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function remove(item) {
|
||||
console.log('item: ', item);
|
||||
console.log('id: ', route.params.id);
|
||||
await axios.post('OrderRows/removes', {
|
||||
actualOrderId: route.params.id,
|
||||
rows: [item.id],
|
||||
});
|
||||
quasar.notify({
|
||||
message: t('globals.dataDeleted'),
|
||||
type: 'positive',
|
||||
});
|
||||
tableLinesRef.value.reload();
|
||||
}
|
||||
|
||||
async function confirmOrder() {
|
||||
await axios.post(`Orders/${route.params.id}/confirm`);
|
||||
quasar.notify({
|
||||
message: t('globals.confirm'),
|
||||
type: 'positive',
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -249,7 +249,6 @@ const columns = computed(() => [
|
|||
data-key="OrderLines"
|
||||
url="OrderRows"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
:right-search="false"
|
||||
:use-model="true"
|
||||
auto-load
|
||||
|
@ -272,7 +271,7 @@ const columns = computed(() => [
|
|||
</template>
|
||||
</VnTable>
|
||||
</div>
|
||||
<QPageSticky :offset="[20, 20]" v-if="!order?.isConfirmed">
|
||||
<QPageSticky :offset="[20, 20]" v-if="!order?.isConfirmed" style="z-index: 2">
|
||||
<QBtn fab icon="check" color="primary" @click="confirmOrder()" />
|
||||
<QTooltip>
|
||||
{{ t('confirm') }}
|
||||
|
|
|
@ -154,7 +154,6 @@ async function fetchClientAddress(id, data) {
|
|||
},
|
||||
}"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
redirect="order"
|
||||
auto-load
|
||||
>
|
||||
|
|
|
@ -78,10 +78,11 @@ const columns = computed(() => [
|
|||
:columns="columns"
|
||||
:right-search="false"
|
||||
:use-model="true"
|
||||
default-mode="card"
|
||||
/>
|
||||
</template>
|
||||
<i18n>
|
||||
es:
|
||||
es:
|
||||
isOwn: Tiene propietario
|
||||
isAnyVolumeAllowed: Permite cualquier volumen
|
||||
Search agency: Buscar agencia
|
||||
|
|
|
@ -117,6 +117,7 @@ function downloadPdfs() {
|
|||
:columns="columns"
|
||||
:right-search="true"
|
||||
:use-model="true"
|
||||
default-mode="card"
|
||||
/>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
@ -237,7 +237,6 @@ const openTicketsDialog = (id) => {
|
|||
url="Routes/filter"
|
||||
:columns="columns"
|
||||
:right-search="true"
|
||||
default-mode="table"
|
||||
:is-editable="true"
|
||||
:create="{
|
||||
urlCreate: 'Routes',
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { ref, computed, onUpdated } from 'vue';
|
||||
import { ref, computed } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
|
|
|
@ -99,7 +99,6 @@ const columns = computed(() => [
|
|||
}"
|
||||
order="id ASC"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
:right-search="false"
|
||||
:use-model="true"
|
||||
|
|
|
@ -5,7 +5,6 @@ import { useI18n } from 'vue-i18n';
|
|||
import FetchData from 'components/FetchData.vue';
|
||||
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();
|
||||
|
|
|
@ -3,6 +3,7 @@ import { onMounted, onUnmounted } from 'vue';
|
|||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { toDate, toCurrency } from 'src/filters/index';
|
||||
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
||||
import TicketSummary from './Card/TicketSummary.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
|
|
|
@ -198,7 +198,6 @@ const columns = computed(() => [
|
|||
}"
|
||||
order="landed DESC"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
redirect="travel"
|
||||
:is-editable="false"
|
||||
|
|
|
@ -77,7 +77,6 @@ const columns = computed(() => [
|
|||
}"
|
||||
order="paymentDate DESC"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
:right-search="false"
|
||||
:is-editable="true"
|
||||
|
|
|
@ -71,7 +71,7 @@ watch(
|
|||
const data = ref(useCardDescription());
|
||||
const setData = (entity) => {
|
||||
if (!entity) return;
|
||||
data.value = useCardDescription(entity.user.nickname, entity.id);
|
||||
data.value = useCardDescription(entity.user?.nickname, entity.id);
|
||||
};
|
||||
|
||||
const openChangePasswordForm = () => changePasswordFormDialog.value.show();
|
||||
|
|
|
@ -116,7 +116,6 @@ const columns = computed(() => [
|
|||
}"
|
||||
order="id DESC"
|
||||
:columns="columns"
|
||||
default-mode="table"
|
||||
auto-load
|
||||
:right-search="false"
|
||||
:is-editable="true"
|
||||
|
|
|
@ -21,9 +21,9 @@ export const useNavigationStore = defineStore('navigationStore', () => {
|
|||
'route',
|
||||
'ticket',
|
||||
'worker',
|
||||
'account',
|
||||
'wagon',
|
||||
'zone',
|
||||
'account',
|
||||
];
|
||||
const pinnedModules = ref([]);
|
||||
const role = useRole();
|
||||
|
|
|
@ -8,7 +8,8 @@ describe('InvoiceInCorrective', () => {
|
|||
it('should create a correcting invoice', () => {
|
||||
cy.viewport(1280, 720);
|
||||
cy.login('developer');
|
||||
cy.visit(`/#/invoice-in/1/summary?limit=10`);
|
||||
cy.visit(`/#/invoice-in/1/summary`);
|
||||
cy.waitForElement('.q-page');
|
||||
|
||||
cy.openActionsDescriptor();
|
||||
|
||||
|
|
|
@ -7,6 +7,7 @@ describe('InvoiceInDescriptor', () => {
|
|||
cy.viewport(1280, 720);
|
||||
cy.login('developer');
|
||||
cy.visit('/#/invoice-in/1/summary');
|
||||
cy.waitForElement('.q-page');
|
||||
|
||||
cy.openActionsDescriptor();
|
||||
cy.get(firstDescritorOpt).click();
|
||||
|
|
|
@ -5,7 +5,7 @@ import { useRouter } from 'vue-router';
|
|||
import * as vueRouter from 'vue-router';
|
||||
|
||||
describe('useArrayData', () => {
|
||||
const filter = '{"order":"","limit":10,"skip":0}';
|
||||
const filter = '{"limit":10,"skip":0}';
|
||||
const params = { supplierFk: 2 };
|
||||
beforeEach(() => {
|
||||
vi.spyOn(useRouter(), 'replace');
|
||||
|
|
Loading…
Reference in New Issue