From fb21bcc02eb76de77d06bf0b978fcc9dac3fdbfe Mon Sep 17 00:00:00 2001 From: pablone Date: Thu, 2 Jan 2025 11:38:04 +0100 Subject: [PATCH 1/3] feat: refs #7301 enhance VnDateBadge styling and improve ItemLastEntries component --- src/components/common/VnDateBadge.vue | 14 ++- src/css/app.scss | 17 +++- src/pages/Item/Card/ItemLastEntries.vue | 88 ++++++++++--------- .../integration/item/itemLastEntries.spec.js | 20 ----- .../integration/ticket/ticketList.spec.js | 2 +- 5 files changed, 70 insertions(+), 71 deletions(-) delete mode 100644 test/cypress/integration/item/itemLastEntries.spec.js diff --git a/src/components/common/VnDateBadge.vue b/src/components/common/VnDateBadge.vue index fd6c9e8a4..83d39937a 100644 --- a/src/components/common/VnDateBadge.vue +++ b/src/components/common/VnDateBadge.vue @@ -11,9 +11,9 @@ function getBadgeAttrs(date) { let timeDiff = today - timeTicket; - if (timeDiff == 0) return { color: 'warning', 'text-color': 'black' }; - if (timeDiff < 0) return { color: 'success', 'text-color': 'black' }; - return { color: 'transparent', 'text-color': 'white' }; + if (timeDiff == 0) return { color: 'warning', class: 'black-text-color' }; + if (timeDiff < 0) return { color: 'success', class: 'black-text-color' }; + return { color: 'transparent', class: 'normal-text-color' }; } function formatShippedDate(date) { @@ -29,3 +29,11 @@ function formatShippedDate(date) { {{ formatShippedDate(date) }} + diff --git a/src/css/app.scss b/src/css/app.scss index fa798d543..993dd9170 100644 --- a/src/css/app.scss +++ b/src/css/app.scss @@ -3,19 +3,21 @@ @import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass'; body.body--light { - --font-color: black; --vn-header-color: #cecece; --vn-page-color: #ffffff; --vn-section-color: #e0e0e0; --vn-section-hover-color: #b9b9b9; - --vn-text-color: var(--font-color); + --vn-text-color: black; --vn-label-color: #5f5f5f; --vn-accent-color: #e7e3e3; + --vn-empty-tag: #acacac; + --vn-black-text-color: black; + --vn-text-color-contrast: white; background-color: var(--vn-page-color); .q-header .q-toolbar { - color: var(--font-color); + color: var(--vn-text-color); } } body.body--dark { @@ -26,6 +28,9 @@ body.body--dark { --vn-text-color: white; --vn-label-color: #a8a8a8; --vn-accent-color: #424242; + --vn-empty-tag: #2d2d2d; + --vn-black-text-color: black; + --vn-text-color-contrast: black; background-color: var(--vn-page-color); } @@ -84,6 +89,10 @@ select:-webkit-autofill { background-color: var(--vn-section-hover-color); } +.bg-vn-page { + background-color: var(--vn-page-color); +} + .color-vn-label { color: var(--vn-label-color); } @@ -187,7 +196,7 @@ select:-webkit-autofill { .q-tooltip { background-color: var(--vn-page-color); - color: var(--font-color); + color: var(--vn-text-color); font-size: medium; } diff --git a/src/pages/Item/Card/ItemLastEntries.vue b/src/pages/Item/Card/ItemLastEntries.vue index 533513ff7..c2df553c3 100644 --- a/src/pages/Item/Card/ItemLastEntries.vue +++ b/src/pages/Item/Card/ItemLastEntries.vue @@ -10,21 +10,12 @@ import { dashIfEmpty } from 'src/filters'; import { toCurrency } from 'filters/index'; import { useArrayData } from 'composables/useArrayData'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; -import axios from 'axios'; import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue'; const { t } = useI18n(); const route = useRoute(); const from = ref(); const to = ref(); -const hideInventory = ref(true); -const inventorySupplierFk = ref(); - -async function getInventorySupplier() { - inventorySupplierFk.value = ( - await axios.get(`InventoryConfigs`) - )?.data[0]?.supplierFk; -} const exprBuilder = (param, value) => { switch (param) { @@ -49,10 +40,6 @@ const where = { itemFk: route.params.id, }; -if (hideInventory.value) { - where.supplierFk = { neq: inventorySupplierFk }; -} - const arrayData = useArrayData('ItemLastEntries', { url: 'Items/lastEntriesFilter', order: ['landed DESC', 'buyFk DESC'], @@ -110,7 +97,7 @@ const columns = computed(() => [ format: (val) => dashIfEmpty(val), }, { - label: t('shelvings.packing'), + label: 'Packing', name: 'packing', field: 'packing', align: 'center', @@ -182,15 +169,11 @@ const updateFilter = async () => { const userFilter = arrayData.store.userFilter.where; userFilter.landed = filter; - if (hideInventory.value) userFilter.supplierFk = { neq: inventorySupplierFk }; - else delete userFilter.supplierFk; await fetchItemLastEntries(); }; onMounted(async () => { - await getInventorySupplier(); - const _from = Date.vnNew(); _from.setDate(_from.getDate() - 75); from.value = getDate(_from, 'from'); @@ -200,12 +183,16 @@ onMounted(async () => { updateFilter(); - watch([from, to, hideInventory], ([nFrom, nTo], [oFrom, oTo]) => { + watch([from, to], ([nFrom, nTo], [oFrom, oTo]) => { if (nFrom && nFrom != oFrom) nFrom = getDate(new Date(nFrom), 'from'); if (nTo && nTo != oTo) nTo = getDate(new Date(nTo), 'to'); updateFilter(); }); }); + +function getBadgeClass(groupingMode, expectedGrouping) { + return groupingMode === expectedGrouping ? 'accent-badge' : 'simple-badge'; +} @@ -249,6 +229,11 @@ onMounted(async () => { /> + + + - @@ -349,4 +342,13 @@ onMounted(async () => { background-color: red; } } +.accent-badge { + background-color: var(--vn-label-color); + color: var(--vn-text-color-contrast); +} +.simple-badge { + background-color: transparent; + color: var(--vn-text-color); + font-size: 14px; +} diff --git a/test/cypress/integration/item/itemLastEntries.spec.js b/test/cypress/integration/item/itemLastEntries.spec.js deleted file mode 100644 index c94cfa480..000000000 --- a/test/cypress/integration/item/itemLastEntries.spec.js +++ /dev/null @@ -1,20 +0,0 @@ -describe('ItemLastEntries', () => { - beforeEach(() => { - cy.viewport(1280, 720); - cy.login('buyer'); - cy.visit('/#/item/1/last-entries'); - cy.intercept('GET', /.*lastEntriesFilter/).as('item'); - cy.waitForElement('tbody'); - }); - - it('should filter by agency', () => { - cy.get('tbody > tr') - .its('length') - .then((rowCount) => { - cy.get('[data-cy="hideInventory"]').click(); - cy.wait('@item'); - cy.waitForElement('tbody'); - cy.get('tbody > tr').should('have.length.greaterThan', rowCount); - }); - }); -}); diff --git a/test/cypress/integration/ticket/ticketList.spec.js b/test/cypress/integration/ticket/ticketList.spec.js index c1d1a0655..b30b4cdad 100644 --- a/test/cypress/integration/ticket/ticketList.spec.js +++ b/test/cypress/integration/ticket/ticketList.spec.js @@ -37,7 +37,7 @@ describe('TicketList', () => { cy.dataCy('ticketSummary').should('exist'); }); - it.only('Client list create new client', () => { + it('Client list create new client', () => { cy.dataCy('vnTableCreateBtn').should('exist'); cy.dataCy('vnTableCreateBtn').click(); const data = { From e648b82ecc820e01d71875bff5080dee155faeaf Mon Sep 17 00:00:00 2001 From: Jon Date: Thu, 2 Jan 2025 14:23:13 +0100 Subject: [PATCH 2/3] fix: dated field --- src/pages/Zone/Card/ZoneEventExclusionForm.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Zone/Card/ZoneEventExclusionForm.vue b/src/pages/Zone/Card/ZoneEventExclusionForm.vue index 0882036c1..4b6aa52bd 100644 --- a/src/pages/Zone/Card/ZoneEventExclusionForm.vue +++ b/src/pages/Zone/Card/ZoneEventExclusionForm.vue @@ -59,7 +59,7 @@ const arrayData = useArrayData('ZoneEvents'); const exclusionGeoCreate = async () => { const params = { zoneFk: parseInt(route.params.id), - date: dated.value, + date: dated, geoIds: tickedNodes.value, }; await axios.post('Zones/exclusionGeo', params); From 272d69d9e19716b07dd2c13fcace5db91fb6e079 Mon Sep 17 00:00:00 2001 From: Jon Date: Thu, 2 Jan 2025 14:33:09 +0100 Subject: [PATCH 3/3] fix: dated field --- src/pages/Zone/Card/ZoneEventExclusionForm.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Zone/Card/ZoneEventExclusionForm.vue b/src/pages/Zone/Card/ZoneEventExclusionForm.vue index 0882036c1..4b6aa52bd 100644 --- a/src/pages/Zone/Card/ZoneEventExclusionForm.vue +++ b/src/pages/Zone/Card/ZoneEventExclusionForm.vue @@ -59,7 +59,7 @@ const arrayData = useArrayData('ZoneEvents'); const exclusionGeoCreate = async () => { const params = { zoneFk: parseInt(route.params.id), - date: dated.value, + date: dated, geoIds: tickedNodes.value, }; await axios.post('Zones/exclusionGeo', params);