From 8cf4d36f47707cb018a33bfd98aa338a41f14cb9 Mon Sep 17 00:00:00 2001
From: pablone <pablone@verdnatura.es>
Date: Fri, 28 Feb 2025 12:55:15 +0100
Subject: [PATCH 1/2] refactor: refs #6897 update component props and improve
UI handling in Entry pages
---
src/pages/Entry/Card/EntryBuys.vue | 3 +-
src/pages/Entry/EntryFilter.vue | 2 +-
src/pages/Entry/EntryStockBought.vue | 46 +++++++----------
src/pages/Entry/EntryStockBoughtDetail.vue | 2 +-
src/pages/Item/Card/ItemDiary.vue | 12 +++--
src/pages/Item/Card/ItemLastEntries.vue | 57 ++++++++++++++++------
6 files changed, 72 insertions(+), 50 deletions(-)
diff --git a/src/pages/Entry/Card/EntryBuys.vue b/src/pages/Entry/Card/EntryBuys.vue
index 67333b5bdb2..401f5c793ea 100644
--- a/src/pages/Entry/Card/EntryBuys.vue
+++ b/src/pages/Entry/Card/EntryBuys.vue
@@ -61,9 +61,10 @@ const columns = [
name: 'workerFk',
component: 'select',
attrs: {
- url: 'Workers/search',
+ url: 'TicketRequests/getItemTypeWorker',
fields: ['id', 'nickname'],
optionLabel: 'nickname',
+ sortBy: 'nickname ASC',
optionValue: 'id',
},
visible: false,
diff --git a/src/pages/Entry/EntryFilter.vue b/src/pages/Entry/EntryFilter.vue
index 8c60918a836..6bce6aa045f 100644
--- a/src/pages/Entry/EntryFilter.vue
+++ b/src/pages/Entry/EntryFilter.vue
@@ -248,7 +248,7 @@ const entryFilterPanel = ref();
<i18n>
en:
params:
- isExcludedFromAvailable: Inventory
+ isExcludedFromAvailable: Is excluded
isOrdered: Ordered
isReceived: Received
isConfirmed: Confirmed
diff --git a/src/pages/Entry/EntryStockBought.vue b/src/pages/Entry/EntryStockBought.vue
index 4bd0fe6408d..41f78617cd1 100644
--- a/src/pages/Entry/EntryStockBought.vue
+++ b/src/pages/Entry/EntryStockBought.vue
@@ -19,6 +19,7 @@ const { t } = useI18n();
const quasar = useQuasar();
const state = useState();
const user = state.getUser();
+const footer = ref({ bought: 0, reserve: 0 });
const columns = computed(() => [
{
align: 'left',
@@ -38,16 +39,14 @@ const columns = computed(() => [
cardVisible: true,
create: true,
attrs: {
- url: 'Workers/activeWithInheritedRole',
- fields: ['id', 'name', 'nickname'],
- where: { role: 'buyer' },
- optionFilter: 'firstName',
+ url: 'TicketRequests/getItemTypeWorker',
+ fields: ['id', 'nickname'],
optionLabel: 'nickname',
+ sortBy: 'nickname ASC',
optionValue: 'id',
- useLike: false,
},
columnFilter: false,
- width: '70px',
+ width: '50px',
},
{
align: 'center',
@@ -58,6 +57,7 @@ const columns = computed(() => [
component: 'number',
summation: true,
width: '50px',
+ format: ({ reserve }, dashIfEmpty) => dashIfEmpty(round(reserve)),
},
{
align: 'center',
@@ -65,6 +65,7 @@ const columns = computed(() => [
name: 'bought',
summation: true,
cardVisible: true,
+ style: ({ reserve, bought }) => boughtStyle(bought, reserve),
columnFilter: false,
},
{
@@ -95,7 +96,6 @@ const columns = computed(() => [
},
},
],
- 'data-cy': 'table-actions',
},
]);
@@ -137,20 +137,20 @@ function openDialog() {
}
function setFooter(data) {
- const footer = {
- bought: 0,
- reserve: 0,
- };
+ footer.value = { bought: 0, reserve: 0 };
data.forEach((row) => {
- footer.bought += row?.bought;
- footer.reserve += row?.reserve;
+ footer.value.bought += row?.bought;
+ footer.value.reserve += row?.reserve;
});
- tableRef.value.footer = footer;
}
function round(value) {
return Math.round(value * 100) / 100;
}
+
+function boughtStyle(bought, reserve) {
+ return reserve < bought ? { color: 'var(--q-negative)' } : '';
+}
</script>
<template>
<VnSubToolbar>
@@ -253,24 +253,14 @@ function round(value) {
<WorkerDescriptorProxy :id="row?.workerFk" />
</span>
</template>
- <template #column-bought="{ row }">
- <span :class="{ 'text-negative': row.reserve < row.bought }">
- {{ row?.bought }}
- </span>
- </template>
<template #column-footer-reserve>
<span>
- {{ round(tableRef.footer.reserve) }}
+ {{ round(footer.reserve) }}
</span>
</template>
<template #column-footer-bought>
- <span
- :class="{
- 'text-negative':
- tableRef.footer.reserve < tableRef.footer.bought,
- }"
- >
- {{ round(tableRef.footer.bought) }}
+ <span :style="boughtStyle(footer?.bought, footer?.reserve)">
+ {{ round(footer.bought) }}
</span>
</template>
</VnTable>
@@ -286,7 +276,7 @@ function round(value) {
justify-content: center;
}
.column {
- min-width: 40%;
+ min-width: 35%;
margin-top: 5%;
display: flex;
flex-direction: column;
diff --git a/src/pages/Entry/EntryStockBoughtDetail.vue b/src/pages/Entry/EntryStockBoughtDetail.vue
index 1a37994d908..4f002ecb968 100644
--- a/src/pages/Entry/EntryStockBoughtDetail.vue
+++ b/src/pages/Entry/EntryStockBoughtDetail.vue
@@ -14,7 +14,7 @@ const $props = defineProps({
required: true,
},
dated: {
- type: Date,
+ type: [Date, String],
required: true,
},
});
diff --git a/src/pages/Item/Card/ItemDiary.vue b/src/pages/Item/Card/ItemDiary.vue
index 31b3c328e2c..b63a1342357 100644
--- a/src/pages/Item/Card/ItemDiary.vue
+++ b/src/pages/Item/Card/ItemDiary.vue
@@ -12,7 +12,7 @@ import FetchData from 'components/FetchData.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
import VnInputDate from 'src/components/common/VnInputDate.vue';
-import { toDateFormat } from 'src/filters/date.js';
+import { toDateTimeFormat } from 'src/filters/date.js';
import { dashIfEmpty } from 'src/filters';
import { date } from 'quasar';
import { useState } from 'src/composables/useState';
@@ -143,7 +143,12 @@ onMounted(async () => {
const fetchItemBalances = async () => await arrayDataItemBalances.fetch({});
const getBadgeAttrs = (_date) => {
- const isSameDate = date.isSameDate(today, _date);
+ let today = Date.vnNew();
+ today.setHours(0, 0, 0, 0);
+ let timeTicket = new Date(_date);
+ timeTicket.setHours(0, 0, 0, 0);
+
+ const isSameDate = date.isSameDate(today, timeTicket);
const attrs = {
'text-color': isSameDate ? 'black' : 'white',
color: isSameDate ? 'warning' : 'transparent',
@@ -153,6 +158,7 @@ const getBadgeAttrs = (_date) => {
const scrollToToday = async () => {
await nextTick();
+ console.log('today.toISOString(): ', today.toISOString());
const todayCell = document.querySelector(`td[data-date="${today.toISOString()}"]`);
if (todayCell) {
todayCell.scrollIntoView({ behavior: 'smooth', block: 'center' });
@@ -244,7 +250,7 @@ async function updateWarehouse(warehouseFk) {
dense
style="font-size: 14px"
>
- {{ toDateFormat(row.shipped) }}
+ {{ toDateTimeFormat(row.shipped) }}
</QBadge>
</QTd>
</template>
diff --git a/src/pages/Item/Card/ItemLastEntries.vue b/src/pages/Item/Card/ItemLastEntries.vue
index 7d8890c2bfb..1eaaa931f16 100644
--- a/src/pages/Item/Card/ItemLastEntries.vue
+++ b/src/pages/Item/Card/ItemLastEntries.vue
@@ -11,7 +11,6 @@ import { toCurrency } from 'filters/index';
import { useArrayData } from 'composables/useArrayData';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
-
const { t } = useI18n();
const route = useRoute();
const from = ref();
@@ -41,7 +40,7 @@ const itemLastEntries = ref([]);
const columns = computed(() => [
{
- label: 'Nv',
+ label: 'NV',
name: 'ig',
align: 'center',
},
@@ -70,6 +69,7 @@ const columns = computed(() => [
field: 'reference',
align: 'center',
format: (_, row) => toCurrency(row.price2) + ' / ' + toCurrency(row.price3),
+ style: (row) => highlightedRow(row),
},
{
label: t('lastEntries.printedStickers'),
@@ -84,6 +84,7 @@ const columns = computed(() => [
field: 'stickers',
align: 'center',
format: (val) => dashIfEmpty(val),
+ style: (row) => highlightedRow(row),
},
{
label: 'Packing',
@@ -102,12 +103,14 @@ const columns = computed(() => [
name: 'stems',
field: 'stems',
align: 'center',
+ style: (row) => highlightedRow(row),
},
{
label: t('lastEntries.quantity'),
name: 'quantity',
field: 'quantity',
align: 'center',
+ style: (row) => highlightedRow(row),
},
{
label: t('lastEntries.cost'),
@@ -120,12 +123,14 @@ const columns = computed(() => [
name: 'weight',
field: 'weight',
align: 'center',
+ style: (row) => highlightedRow(row),
},
{
label: t('lastEntries.cube'),
name: 'cube',
field: 'packagingFk',
align: 'center',
+ style: (row) => highlightedRow(row),
},
{
label: t('lastEntries.supplier'),
@@ -203,11 +208,28 @@ onMounted(async () => {
if (nTo && nTo != oTo) nTo = getDate(new Date(nTo), 'to');
updateFilter();
});
+
+ const rows = document.querySelectorAll('tr');
+ console.log('rows: ', rows);
+ rows.forEach((row) => {
+ const td = row.querySelector('td[data-is-inventory="1"]');
+ if (td) {
+ row.classList.add('inventory-row');
+ }
+ });
});
function getBadgeClass(groupingMode, expectedGrouping) {
return groupingMode === expectedGrouping ? 'accent-badge' : 'simple-badge';
}
+
+function highlightedRow(row) {
+ return row?.isInventorySupplier
+ ? {
+ 'background-color': 'var(--vn-section-hover-color)',
+ }
+ : '';
+}
</script>
<template>
<VnSubToolbar>
@@ -236,7 +258,7 @@ function getBadgeClass(groupingMode, expectedGrouping) {
:no-data-label="t('globals.noResults')"
>
<template #body-cell-ig="{ row }">
- <QTd class="text-center">
+ <QTd class="text-center" :style="highlightedRow(row)">
<QIcon
:name="row.isIgnored ? 'check_box' : 'check_box_outline_blank'"
style="color: var(--vn-label-color)"
@@ -245,38 +267,38 @@ function getBadgeClass(groupingMode, expectedGrouping) {
</QTd>
</template>
<template #body-cell-warehouse="{ row }">
- <QTd>
+ <QTd :style="highlightedRow(row)">
<span>{{ row.warehouse }}</span>
</QTd>
</template>
<template #body-cell-date="{ row }">
- <QTd class="text-center">
+ <QTd class="text-center" :style="highlightedRow(row)">
<VnDateBadge :date="row.landed" />
</QTd>
</template>
<template #body-cell-entry="{ row }">
- <QTd @click.stop>
+ <QTd @click.stop :style="highlightedRow(row)">
<div class="full-width flex justify-center">
<EntryDescriptorProxy :id="row.entryFk" class="q-ma-none" dense />
<span class="link">{{ row.entryFk }}</span>
</div>
</QTd>
</template>
- <template #body-cell-pvp="{ value }">
- <QTd @click.stop class="text-center">
+ <template #body-cell-pvp="{ row, value }">
+ <QTd @click.stop class="text-center" :style="highlightedRow(row)">
<span> {{ value }}</span>
- <QTooltip> {{ t('lastEntries.grouping') }}/Packing </QTooltip></QTd
- >
+ <QTooltip> {{ t('lastEntries.grouping') }}/Packing </QTooltip>
+ </QTd>
</template>
<template #body-cell-printedStickers="{ row }">
- <QTd @click.stop class="text-center">
+ <QTd @click.stop class="text-center" :style="highlightedRow(row)">
<span style="color: var(--vn-label-color)">
{{ row.printedStickers }}</span
>
</QTd>
</template>
<template #body-cell-packing="{ row }">
- <QTd @click.stop>
+ <QTd @click.stop :style="highlightedRow(row)">
<QBadge
class="center-content"
:class="getBadgeClass(row.groupingMode, 'packing')"
@@ -288,7 +310,7 @@ function getBadgeClass(groupingMode, expectedGrouping) {
</QTd>
</template>
<template #body-cell-grouping="{ row }">
- <QTd @click.stop>
+ <QTd @click.stop :style="highlightedRow(row)">
<QBadge
class="center-content"
:class="getBadgeClass(row.groupingMode, 'grouping')"
@@ -300,7 +322,7 @@ function getBadgeClass(groupingMode, expectedGrouping) {
</QTd>
</template>
<template #body-cell-cost="{ row }">
- <QTd @click.stop class="text-center">
+ <QTd @click.stop class="text-center" :style="highlightedRow(row)">
<span>
{{ toCurrency(row.cost, 'EUR', 3) }}
<QTooltip>
@@ -319,7 +341,7 @@ function getBadgeClass(groupingMode, expectedGrouping) {
</QTd>
</template>
<template #body-cell-supplier="{ row }">
- <QTd @click.stop>
+ <QTd @click.stop :style="highlightedRow(row)">
<div class="full-width flex justify-left">
<QBadge
:class="
@@ -341,6 +363,10 @@ function getBadgeClass(groupingMode, expectedGrouping) {
Hide inventory supplier: Ocultar proveedor inventario
</i18n>
<style lang="scss" scoped>
+.inventory-row {
+ background-color: #f0f0f0; /* Cambia el color de fondo o cualquier otro estilo */
+}
+
.q-badge--rounded {
border-radius: 50%;
}
@@ -354,7 +380,6 @@ function getBadgeClass(groupingMode, expectedGrouping) {
.th :first-child {
.td {
text-align: center;
- background-color: red;
}
}
.accent-badge {
From 61aa750ae0f64b471f9ac30b52de3b1c8fe56bb3 Mon Sep 17 00:00:00 2001
From: pablone <pablone@verdnatura.es>
Date: Fri, 28 Feb 2025 13:00:15 +0100
Subject: [PATCH 2/2] refactor: refs #6897 remove debug logs and unused style
---
src/pages/Item/Card/ItemDiary.vue | 1 -
src/pages/Item/Card/ItemLastEntries.vue | 13 -------------
2 files changed, 14 deletions(-)
diff --git a/src/pages/Item/Card/ItemDiary.vue b/src/pages/Item/Card/ItemDiary.vue
index b63a1342357..83cd562a0a1 100644
--- a/src/pages/Item/Card/ItemDiary.vue
+++ b/src/pages/Item/Card/ItemDiary.vue
@@ -158,7 +158,6 @@ const getBadgeAttrs = (_date) => {
const scrollToToday = async () => {
await nextTick();
- console.log('today.toISOString(): ', today.toISOString());
const todayCell = document.querySelector(`td[data-date="${today.toISOString()}"]`);
if (todayCell) {
todayCell.scrollIntoView({ behavior: 'smooth', block: 'center' });
diff --git a/src/pages/Item/Card/ItemLastEntries.vue b/src/pages/Item/Card/ItemLastEntries.vue
index 1eaaa931f16..1fb8bc287ca 100644
--- a/src/pages/Item/Card/ItemLastEntries.vue
+++ b/src/pages/Item/Card/ItemLastEntries.vue
@@ -208,15 +208,6 @@ onMounted(async () => {
if (nTo && nTo != oTo) nTo = getDate(new Date(nTo), 'to');
updateFilter();
});
-
- const rows = document.querySelectorAll('tr');
- console.log('rows: ', rows);
- rows.forEach((row) => {
- const td = row.querySelector('td[data-is-inventory="1"]');
- if (td) {
- row.classList.add('inventory-row');
- }
- });
});
function getBadgeClass(groupingMode, expectedGrouping) {
@@ -363,10 +354,6 @@ function highlightedRow(row) {
Hide inventory supplier: Ocultar proveedor inventario
</i18n>
<style lang="scss" scoped>
-.inventory-row {
- background-color: #f0f0f0; /* Cambia el color de fondo o cualquier otro estilo */
-}
-
.q-badge--rounded {
border-radius: 50%;
}