From a6ebe9cf19f2ddd6c05649b8096ad93367c18aae Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 24 Apr 2024 12:54:38 -0300
Subject: [PATCH 1/3] Item barcode

---
 src/css/app.scss                    |  5 ++
 src/i18n/locale/en.yml              |  1 +
 src/i18n/locale/es.yml              |  1 +
 src/pages/Item/Card/ItemBarcode.vue | 80 +++++++++++++++++++++++++++++
 src/router/modules/item.js          | 12 ++++-
 5 files changed, 98 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/Item/Card/ItemBarcode.vue

diff --git a/src/css/app.scss b/src/css/app.scss
index 25b484649..9037802ad 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -119,6 +119,11 @@ select:-webkit-autofill {
     font-variation-settings: 'FILL' 1;
 }
 
+.fill-icon-on-hover:hover {
+    font-variation-settings: 'FILL' 1;
+    cursor: pointer;
+}
+
 .vn-table-separation-row {
     height: 16px !important;
     background-color: var(--vn-section-color) !important;
diff --git a/src/i18n/locale/en.yml b/src/i18n/locale/en.yml
index 3ac3d18a0..338dff60b 100644
--- a/src/i18n/locale/en.yml
+++ b/src/i18n/locale/en.yml
@@ -1119,6 +1119,7 @@ item:
         tags: Tags
         wasteBreakdown: Waste breakdown
         itemCreate: New item
+        barcode: Barcode
     descriptor:
         item: Item
         buyer: Buyer
diff --git a/src/i18n/locale/es.yml b/src/i18n/locale/es.yml
index 4ecbcdbc0..7e9c5f669 100644
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@@ -1118,6 +1118,7 @@ item:
         tags: Etiquetas
         wasteBreakdown: Deglose de mermas
         itemCreate: Nuevo artículo
+        barcode: Códigos de barras
     descriptor:
         item: Artículo
         buyer: Comprador
diff --git a/src/pages/Item/Card/ItemBarcode.vue b/src/pages/Item/Card/ItemBarcode.vue
new file mode 100644
index 000000000..6a13a9ea7
--- /dev/null
+++ b/src/pages/Item/Card/ItemBarcode.vue
@@ -0,0 +1,80 @@
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+
+import CrudModel from 'components/CrudModel.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+
+const route = useRoute();
+const { t } = useI18n();
+
+const itemBarcodeRef = ref(null);
+
+onMounted(() => {
+    if (itemBarcodeRef.value) itemBarcodeRef.value.reload();
+});
+</script>
+<template>
+    <div class="full-width flex justify-center">
+        <QPage class="card-width q-pa-lg">
+            <CrudModel
+                :data-required="{ itemFk: route.params.id }"
+                :default-remove="false"
+                :filter="{
+                    fields: ['id', 'itemFk', 'code'],
+                    where: { itemFk: route.params.id },
+                }"
+                data-key="ItemBarcodes"
+                model="ItemBarcodes"
+                ref="itemBarcodeRef"
+                url="ItemBarcodes"
+            >
+                <template #body="{ rows }">
+                    <QCard class="q-px-lg q-py-md">
+                        <div
+                            v-for="(row, index) in rows"
+                            :key="index"
+                            class="q-mb-md full-width row items-center no-wrap"
+                        >
+                            <VnInput
+                                :label="t('Code')"
+                                v-model="row.code"
+                                class="full-width"
+                            />
+                            <QIcon
+                                @click="itemBarcodeRef.remove([row])"
+                                class="cursor-pointer q-ml-md"
+                                color="primary"
+                                name="delete"
+                                size="sm"
+                            >
+                                <QTooltip class="text-no-wrap">
+                                    {{ t('Remove barcode') }}
+                                </QTooltip>
+                            </QIcon>
+                        </div>
+                        <QIcon
+                            @click="itemBarcodeRef.insert()"
+                            class="cursor-pointer fill-icon-on-hover"
+                            color="primary"
+                            name="add_circle"
+                            size="sm"
+                        >
+                            <QTooltip>
+                                {{ t('Add barcode') }}
+                            </QTooltip>
+                        </QIcon>
+                    </QCard>
+                </template>
+            </CrudModel>
+        </QPage>
+    </div>
+</template>
+
+<i18n>
+es:
+    Code: Código
+    Remove barcode: Quitar código de barras
+    Add barcode: Añadir código de barras
+</i18n>
diff --git a/src/router/modules/item.js b/src/router/modules/item.js
index 41f3ec92a..35abbb5c7 100644
--- a/src/router/modules/item.js
+++ b/src/router/modules/item.js
@@ -6,12 +6,13 @@ export default {
     meta: {
         title: 'items',
         icon: 'vn:item',
+        moduleName: 'Item',
     },
     component: RouterView,
     redirect: { name: 'ItemMain' },
     menus: {
         main: ['ItemList', 'WasteBreakdown'],
-        card: ['ItemBasicData'],
+        card: ['ItemBasicData', 'ItemBarcode'],
     },
     children: [
         {
@@ -94,6 +95,15 @@ export default {
                     },
                     component: () => import('src/pages/Item/Card/ItemBasicData.vue'),
                 },
+                {
+                    path: 'barcode',
+                    name: 'ItemBarcode',
+                    meta: {
+                        title: 'barcode',
+                        icon: 'vn:barcode',
+                    },
+                    component: () => import('src/pages/Item/Card/ItemBarcode.vue'),
+                },
             ],
         },
     ],

From 84a9dc831906ab02c253026b22b8073301df3fd6 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 24 Apr 2024 17:30:53 -0300
Subject: [PATCH 2/3] Fix ItemDescriptor labels

---
 src/pages/Item/Card/ItemDescriptor.vue | 21 +++++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/src/pages/Item/Card/ItemDescriptor.vue b/src/pages/Item/Card/ItemDescriptor.vue
index 981de0632..77b078296 100644
--- a/src/pages/Item/Card/ItemDescriptor.vue
+++ b/src/pages/Item/Card/ItemDescriptor.vue
@@ -271,14 +271,27 @@ const openCloneDialog = async () => {
             <VnLv :label="t('item.descriptor.buyer')">
                 <template #value>
                     <span class="link">
-                        {{ t('item.descriptor.buyer') }}
+                        {{ entity.itemType?.worker?.user?.name }}
                         <WorkerDescriptorProxy :id="entity.itemType?.worker?.id" />
                     </span>
                 </template>
             </VnLv>
-            <VnLv :label="t('item.descriptor.color')" :value="entity.value5"> </VnLv>
-            <VnLv :label="t('item.descriptor.color')" :value="entity.value6" />
-            <VnLv :label="t('item.descriptor.stems')" :value="entity.value7" />
+            <VnLv
+                v-if="entity.value5"
+                :label="t('item.descriptor.color')"
+                :value="entity.value5"
+            >
+            </VnLv>
+            <VnLv
+                v-if="entity.value6"
+                :label="t('item.descriptor.category')"
+                :value="entity.value6"
+            />
+            <VnLv
+                v-if="entity.value7"
+                :label="t('item.descriptor.stems')"
+                :value="entity.value7"
+            />
         </template>
         <template #actions="{}">
             <QCardActions class="row justify-center">

From 485e916f55d08cd576e00b0f397c61fe57cad02f Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Fri, 26 Apr 2024 09:16:26 -0300
Subject: [PATCH 3/3] Add input focus

---
 src/pages/Item/Card/ItemBarcode.vue | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/pages/Item/Card/ItemBarcode.vue b/src/pages/Item/Card/ItemBarcode.vue
index 6a13a9ea7..d0beab350 100644
--- a/src/pages/Item/Card/ItemBarcode.vue
+++ b/src/pages/Item/Card/ItemBarcode.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, nextTick } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -11,7 +11,20 @@ const { t } = useI18n();
 
 const itemBarcodeRef = ref(null);
 
-onMounted(() => {
+const insertRow = () => {
+    itemBarcodeRef.value.insert();
+    focusLastInput();
+};
+
+const focusLastInput = () => {
+    nextTick(() => {
+        const inputs = document.querySelectorAll('[focusable-input]');
+        const lastInput = inputs[inputs.length - 1];
+        if (lastInput) lastInput.focus();
+    });
+};
+
+onMounted(async () => {
     if (itemBarcodeRef.value) itemBarcodeRef.value.reload();
 });
 </script>
@@ -31,7 +44,7 @@ onMounted(() => {
                 url="ItemBarcodes"
             >
                 <template #body="{ rows }">
-                    <QCard class="q-px-lg q-py-md">
+                    <QCard v-if="rows.length > 0" class="q-px-lg q-py-md">
                         <div
                             v-for="(row, index) in rows"
                             :key="index"
@@ -41,6 +54,7 @@ onMounted(() => {
                                 :label="t('Code')"
                                 v-model="row.code"
                                 class="full-width"
+                                focusable-input
                             />
                             <QIcon
                                 @click="itemBarcodeRef.remove([row])"
@@ -55,7 +69,7 @@ onMounted(() => {
                             </QIcon>
                         </div>
                         <QIcon
-                            @click="itemBarcodeRef.insert()"
+                            @click="insertRow()"
                             class="cursor-pointer fill-icon-on-hover"
                             color="primary"
                             name="add_circle"