From ec5eeaa30831e09f261e8d61b44665599cb1c497 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Fri, 28 Jun 2024 10:14:24 +0200
Subject: [PATCH] fix: refs #6151 fixed filters and styles

---
 src/pages/Order/Card/OrderCard.vue          |  9 ++----
 src/pages/Order/Card/OrderCatalogFilter.vue | 35 ++++++---------------
 src/pages/Order/Card/OrderCatalogItem.vue   |  2 +-
 src/pages/Order/Card/OrderSummary.vue       | 24 +++++++++-----
 src/pages/Order/OrderCatalog.vue            |  1 +
 src/pages/Order/OrderList.vue               |  8 +++--
 6 files changed, 38 insertions(+), 41 deletions(-)

diff --git a/src/pages/Order/Card/OrderCard.vue b/src/pages/Order/Card/OrderCard.vue
index 5b6896656..12b61e913 100644
--- a/src/pages/Order/Card/OrderCard.vue
+++ b/src/pages/Order/Card/OrderCard.vue
@@ -2,7 +2,6 @@
 import VnCard from 'components/common/VnCard.vue';
 import OrderDescriptor from 'pages/Order/Card/OrderDescriptor.vue';
 import OrderFilter from './OrderFilter.vue';
-import OrderSearchbar from './OrderSearchbar.vue';
 </script>
 <template>
     <VnCard
@@ -11,9 +10,7 @@ import OrderSearchbar from './OrderSearchbar.vue';
         :descriptor="OrderDescriptor"
         :filter-panel="OrderFilter"
         search-data-key="OrderList"
-    >
-        <template #searchbar>
-            <OrderSearchbar />
-        </template>
-    </VnCard>
+        searchbar-label="Search order"
+        searchbar-info="ypu can search by order id or name"
+    />
 </template>
diff --git a/src/pages/Order/Card/OrderCatalogFilter.vue b/src/pages/Order/Card/OrderCatalogFilter.vue
index fd5300122..c354ec94b 100644
--- a/src/pages/Order/Card/OrderCatalogFilter.vue
+++ b/src/pages/Order/Card/OrderCatalogFilter.vue
@@ -37,6 +37,10 @@ const selectedOrder = ref(null);
 const selectedOrderField = ref(null);
 const moreFields = ref([]);
 const moreFieldsOrder = ref([]);
+const selectedTag = ref(null);
+const tagValues = ref([{}]);
+const tagOptions = ref([]);
+
 const createValue = (val, done) => {
     if (val.length > 2) {
         if (!tagOptions.value.includes(val)) {
@@ -95,10 +99,6 @@ function exprBuilder(param, value) {
     }
 }
 
-const selectedTag = ref(null);
-const tagValues = ref([{}]);
-const tagOptions = ref([]);
-
 const applyTagFilter = (params, search) => {
     if (!tagValues.value?.length) {
         params.tagGroups = null;
@@ -139,39 +139,23 @@ const onOrderChange = (value, params) => {
 };
 
 const onOrderFieldChange = (value, params) => {
-    const tagObj = JSON.parse(params.orderBy); // esto donde va
-    const fields = {
-        Relevancy: (value) => value + ' DESC, name',
-        ColorAndPrice: 'showOrder, price',
-        Name: 'name',
-        Price: 'price',
-    };
-    let tagField = fields[value];
-    if (!tagField) return;
-
-    if (typeof tagField === 'function') tagField = tagField(value);
-    tagObj.field = tagField;
-    params.orderBy = JSON.stringify(tagObj);
+    const tagObj = JSON.parse(params.orderBy);
     switch (value) {
         case 'Relevancy':
-            tagObj.field = value + ' DESC, name';
+            tagObj.name = value + ' DESC, name';
             params.orderBy = JSON.stringify(tagObj);
-            console.log('params: ', params);
             break;
         case 'ColorAndPrice':
-            tagObj.field = 'showOrder, price';
+            tagObj.name = 'showOrder, price';
             params.orderBy = JSON.stringify(tagObj);
-            console.log('params: ', params);
             break;
         case 'Name':
-            tagObj.field = 'name';
+            tagObj.name = 'name';
             params.orderBy = JSON.stringify(tagObj);
-            console.log('params: ', params);
             break;
         case 'Price':
-            tagObj.field = 'price';
+            tagObj.name = 'price';
             params.orderBy = JSON.stringify(tagObj);
-            console.log('params: ', params);
             break;
     }
 };
@@ -312,6 +296,7 @@ const useLang = (values) => {
                         v-model="selectedOrder"
                         :options="moreFields"
                         option-label="label"
+                        option-value="way"
                         dense
                         outlined
                         rounded
diff --git a/src/pages/Order/Card/OrderCatalogItem.vue b/src/pages/Order/Card/OrderCatalogItem.vue
index 34e22915d..8fa0bb5b9 100644
--- a/src/pages/Order/Card/OrderCatalogItem.vue
+++ b/src/pages/Order/Card/OrderCatalogItem.vue
@@ -27,7 +27,7 @@ const dialog = ref(null);
     <div class="container order-catalog-item overflow-hidden">
         <QCard class="card shadow-6">
             <div class="img-wrapper">
-                <VnImg :id="item.id" class="image" />
+                <VnImg :id="item.id" zoom-size="lg" class="image" />
                 <div v-if="item.hex" class="item-color-container">
                     <div
                         class="item-color"
diff --git a/src/pages/Order/Card/OrderSummary.vue b/src/pages/Order/Card/OrderSummary.vue
index d82dbaa17..7961b250e 100644
--- a/src/pages/Order/Card/OrderSummary.vue
+++ b/src/pages/Order/Card/OrderSummary.vue
@@ -7,6 +7,8 @@ import VnLv from 'components/ui/VnLv.vue';
 import CardSummary from 'components/ui/CardSummary.vue';
 import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';
+import VnTitle from 'src/components/common/VnTitle.vue';
+import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 
 const { t } = useI18n();
 const route = useRoute();
@@ -62,6 +64,10 @@ const detailsColumns = ref([
             </template>
             <template #body="{ entity }">
                 <QCard class="vn-one">
+                    <VnTitle
+                        :url="`#/order/${entity.id}/basic-data`"
+                        :text="t('globals.pageTitles.basicData')"
+                    />
                     <VnLv label="ID" :value="entity.id" />
                     <VnLv :label="t('order.summary.nickname')" dash>
                         <template #value>
@@ -81,6 +87,10 @@ const detailsColumns = ref([
                     />
                 </QCard>
                 <QCard class="vn-one">
+                    <VnTitle
+                        :url="`#/order/${entity.id}/basic-data`"
+                        :text="t('globals.pageTitles.basicData')"
+                    />
                     <VnLv
                         :label="t('order.summary.created')"
                         :value="toDateHourMinSec(entity?.created)"
@@ -116,14 +126,13 @@ const detailsColumns = ref([
                     />
                 </QCard>
                 <QCard class="vn-one">
-                    <p class="header">
-                        {{ t('order.summary.notes') }}
-                    </p>
+                    <VnTitle :text="t('globals.pageTitles.notes')" />
                     <p v-if="entity?.note" class="no-margin">
                         {{ entity?.note }}
                     </p>
                 </QCard>
                 <QCard class="vn-one">
+                    <VnTitle :text="t('order.summary.total')" />
                     <VnLv>
                         <template #label>
                             <span class="text-h6">{{ t('order.summary.subtotal') }}</span>
@@ -152,9 +161,7 @@ const detailsColumns = ref([
                     </VnLv>
                 </QCard>
                 <QCard>
-                    <p class="header">
-                        {{ t('order.summary.details') }}
-                    </p>
+                    <VnTitle :text="t('order.summary.details')" />
                     <QTable :columns="detailsColumns" :rows="entity?.rows" flat>
                         <template #header="props">
                             <QTr :props="props">
@@ -168,7 +175,10 @@ const detailsColumns = ref([
                         <template #body="props">
                             <QTr :props="props">
                                 <QTd key="item" :props="props" class="item">
-                                    {{ props.row.item?.id }}
+                                    <span class="link">
+                                        {{ props.row.item?.id }}
+                                        <ItemDescriptorProxy :id="props.row.item?.id" />
+                                    </span>
                                 </QTd>
                                 <QTd key="description" :props="props" class="description">
                                     <div class="name">
diff --git a/src/pages/Order/OrderCatalog.vue b/src/pages/Order/OrderCatalog.vue
index 1d97663d0..081a2cd2f 100644
--- a/src/pages/Order/OrderCatalog.vue
+++ b/src/pages/Order/OrderCatalog.vue
@@ -70,6 +70,7 @@ function extractValueTags(items) {
                 :user-params="catalogParams"
                 auto-load
                 @on-fetch="extractTags"
+                :update-router="false"
             >
                 <template #body="{ rows }">
                     <div class="catalog-list">
diff --git a/src/pages/Order/OrderList.vue b/src/pages/Order/OrderList.vue
index 247a8e3b2..0e6e11482 100644
--- a/src/pages/Order/OrderList.vue
+++ b/src/pages/Order/OrderList.vue
@@ -9,7 +9,7 @@ import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
 import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
 import VnPaginate from 'components/ui/VnPaginate.vue';
 import VnLv from 'components/ui/VnLv.vue';
-import OrderSearchbar from 'pages/Order/Card/OrderSearchbar.vue';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import OrderFilter from 'pages/Order/Card/OrderFilter.vue';
 import OrderSummary from 'pages/Order/Card/OrderSummary.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
@@ -28,7 +28,11 @@ function navigate(id) {
 }
 </script>
 <template>
-    <OrderSearchbar />
+    <VnSearchbar
+        data-key="OrderList"
+        :label="t('Search order')"
+        :info="t('You can search orders by reference')"
+    />
     <RightMenu>
         <template #right-panel>
             <OrderFilter data-key="OrderList" />