From 6eb0c93802235e86ce1cecf9a7694a9f0cca9d55 Mon Sep 17 00:00:00 2001
From: jgallego <jgallego@verdnatura.es>
Date: Thu, 3 Oct 2024 10:17:36 +0200
Subject: [PATCH] feat: manual invoice in two lines

---
 src/pages/InvoiceOut/InvoiceOutList.vue | 102 +++++++++++++-----------
 1 file changed, 57 insertions(+), 45 deletions(-)

diff --git a/src/pages/InvoiceOut/InvoiceOutList.vue b/src/pages/InvoiceOut/InvoiceOutList.vue
index ba0a1d113..8a3a618ac 100644
--- a/src/pages/InvoiceOut/InvoiceOutList.vue
+++ b/src/pages/InvoiceOut/InvoiceOutList.vue
@@ -230,42 +230,58 @@ watchEffect(selectedRows);
             </span>
         </template>
         <template #more-create-dialog="{ data }">
-            <div class="flex no-wrap flex-center">
-                <VnSelect
-                    url="Tickets"
-                    v-model="data.ticketFk"
-                    :label="t('invoiceOutList.tableVisibleColumns.ticket')"
-                    option-label="id"
-                    option-value="id"
-                >
-                    <template #option="scope">
-                        <QItem v-bind="scope.itemProps">
-                            <QItemSection>
-                                <QItemLabel> #{{ scope.opt?.id }} </QItemLabel>
-                                <QItemLabel caption>{{ scope.opt?.nickname }}</QItemLabel>
-                            </QItemSection>
-                        </QItem>
-                    </template>
-                </VnSelect>
-                <span class="q-ml-md">O</span>
+            <div class="row q-col-gutter-md">
+                <div class="col-12">
+                    <VnSelect
+                        url="Tickets"
+                        v-model="data.ticketFk"
+                        :label="t('invoiceOutList.tableVisibleColumns.ticket')"
+                        option-label="id"
+                        option-value="id"
+                    >
+                        <template #option="scope">
+                            <QItem v-bind="scope.itemProps">
+                                <QItemSection>
+                                    <QItemLabel> #{{ scope.opt?.id }} </QItemLabel>
+                                    <QItemLabel caption>{{
+                                        scope.opt?.nickname
+                                    }}</QItemLabel>
+                                </QItemSection>
+                            </QItem>
+                        </template>
+                    </VnSelect>
+                </div>
+            </div>
+            <div class="row q-col-gutter-md">
+                <div class="col-12">
+                    <span class="q-ml-md q-mt-md">O</span>
+                </div>
+            </div>
+            <div class="row q-col-gutter-md">
+                <div class="col-12">
+                    <VnSelect
+                        url="Clients"
+                        v-model="data.clientFk"
+                        :label="t('invoiceOutModule.customer')"
+                        :options="customerOptions"
+                        option-label="name"
+                        option-value="id"
+                        @update:model-value="fetchClientAddress"
+                    />
+                </div>
+            </div>
+            <div class="row q-col-gutter-md">
+                <div class="col-12">
+                    <VnSelect
+                        v-model="data.addressFk"
+                        :label="t('invoiceOutModule.address')"
+                        :options="addressOptions"
+                        option-value="id"
+                        option-label="nickname"
+                        :disable="!data.clientFk"
+                    />
+                </div>
             </div>
-            <VnSelect
-                url="Clients"
-                v-model="data.clientFk"
-                :label="t('invoiceOutModule.customer')"
-                :options="customerOptions"
-                option-label="name"
-                option-value="id"
-                @update:model-value="fetchClientAddress"
-            />
-            <VnSelect
-                v-model="data.addressFk"
-                :label="t('invoiceOutModule.address')"
-                :options="addressOptions"
-                option-value="id"
-                option-label="nickname"
-                :disable="!data.clientFk"
-            />
 
             <VnSelect
                 url="InvoiceOutSerials"
@@ -294,20 +310,16 @@ watchEffect(selectedRows);
         </template>
     </VnTable>
 </template>
-
 <i18n>
-en:
+    en:
     searchInvoice: Search issued invoice
     fileDenied: Browser denied file download...
     fileAllowed: Successful download of CSV file
     youCanSearchByInvoiceReference: You can search by invoice reference
-    createInvoice: Make invoice
-    Create manual invoice: Create manual invoice
-es:
-    searchInvoice: Buscar factura emitida
-    fileDenied: El navegador denegó la descarga de archivos...
-    fileAllowed: Descarga exitosa de archivo CSV
+    createInvoice: Make invoice Create manual invoice: Create manual invoice
+    es:
+    searchInvoice: Buscar factura emitida fileDenied: El navegador denegó la
+    descarga de archivos... fileAllowed: Descarga exitosa de archivo CSV
     youCanSearchByInvoiceReference: Puedes buscar por referencia de la factura
-    createInvoice: Crear factura
-    Create manual invoice: Crear factura manual
+    createInvoice: Crear factura Create manual invoice: Crear factura manual
 </i18n>