From b0178915080ff8558a7ee31110d7cbffb6a7bf2f Mon Sep 17 00:00:00 2001
From: Pau Navarro <pau@verdnatura.es>
Date: Tue, 20 Dec 2022 09:55:47 +0100
Subject: [PATCH] refactor to follow current styles

---
 src/pages/Worker/Card/WorkerDescriptor.vue | 15 -------
 src/pages/Worker/Card/WorkerSummary.vue    | 47 ++--------------------
 src/pages/Worker/WorkerList.vue            | 10 +++--
 src/router/modules/index.js                |  4 +-
 src/router/modules/worker.js               | 10 ++---
 src/stores/useNavigationStore.js           |  2 +-
 6 files changed, 18 insertions(+), 70 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerDescriptor.vue b/src/pages/Worker/Card/WorkerDescriptor.vue
index 27c15b6fb..ad23f732b 100644
--- a/src/pages/Worker/Card/WorkerDescriptor.vue
+++ b/src/pages/Worker/Card/WorkerDescriptor.vue
@@ -80,45 +80,30 @@ function getWorkerAvatar() {
             <q-img :src="getWorkerAvatar()" class="q-mb-md" />
             <q-list>
                 <q-item>
-                    <q-item-section side>
-                        <q-icon name="person" />
-                    </q-item-section>
                     <q-item-section>
                         <q-item-label caption> {{ t('worker.card.name') }} </q-item-label>
                         <q-item-label>{{ worker.user.nickname }}</q-item-label>
                     </q-item-section>
                 </q-item>
                 <q-item>
-                    <q-item-section side>
-                        <q-icon name="email" />
-                    </q-item-section>
                     <q-item-section>
                         <q-item-label caption> {{ t('worker.card.email') }} </q-item-label>
                         <q-item-label>{{ worker.user.email }}</q-item-label>
                     </q-item-section>
                 </q-item>
                 <q-item>
-                    <q-item-section side>
-                        <q-icon name="work" />
-                    </q-item-section>
                     <q-item-section>
                         <q-item-label caption> {{ t('worker.list.department') }} </q-item-label>
                         <q-item-label>{{ worker.department.department.name }}</q-item-label>
                     </q-item-section>
                 </q-item>
                 <q-item>
-                    <q-item-section side>
-                        <q-icon name="phone" />
-                    </q-item-section>
                     <q-item-section>
                         <q-item-label caption> {{ t('worker.card.phone') }} </q-item-label>
                         <q-item-label>{{ worker.phone }}</q-item-label>
                     </q-item-section>
                 </q-item>
                 <q-item>
-                    <q-item-section side>
-                        <q-icon name="extension" />
-                    </q-item-section>
                     <q-item-section>
                         <q-item-label caption>{{ t('worker.summary.sipExtension') }} </q-item-label>
                         <q-item-label>{{ sipExtension() }}</q-item-label>
diff --git a/src/pages/Worker/Card/WorkerSummary.vue b/src/pages/Worker/Card/WorkerSummary.vue
index fdf6cf9d9..1172c99b8 100644
--- a/src/pages/Worker/Card/WorkerSummary.vue
+++ b/src/pages/Worker/Card/WorkerSummary.vue
@@ -3,7 +3,6 @@ import { ref, onMounted, computed, onUpdated } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
-import { useSession } from 'src/composables/useSession';
 import axios from 'axios';
 import workerDescriptorDialog from './WorkerDescriptorDialog.vue';
 
@@ -14,7 +13,6 @@ onUpdated(() => fetch());
 const route = useRoute();
 const { t } = useI18n();
 const quasar = useQuasar();
-const { getToken } = useSession();
 
 t == t;
 
@@ -86,11 +84,6 @@ function openDescriptorDialog(id) {
         },
     });
 }
-
-function getWorkerAvatar() {
-    const token = getToken();
-    return `/api/Images/user/160x160/${worker.value.boss.id}/download?access_token=${token}`;
-}
 </script>
 
 <template>
@@ -98,7 +91,9 @@ function getWorkerAvatar() {
         <q-card>
             <skeleton-summary v-if="!worker" />
             <template v-if="worker">
-                <div class="header bg-primary q-pa-sm q-mb-md">{{ worker.id }} - {{ worker.firstName }}</div>
+                <div class="header bg-primary q-pa-sm q-mb-md">
+                    {{ worker.id }} - {{ worker.firstName }} {{ worker.lastName }}
+                </div>
                 <div class="row q-pa-md q-col-gutter-md q-mb-md">
                     <div class="col">
                         <q-list>
@@ -106,45 +101,30 @@ function getWorkerAvatar() {
                                 {{ t('worker.summary.basicData') }}
                             </q-item-label>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="grid_3x3" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption> ID </q-item-label>
                                     <q-item-label>{{ worker.id }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="person" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.card.name') }} </q-item-label>
                                     <q-item-label>{{ worker.user.nickname }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="work" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.list.department') }} </q-item-label>
                                     <q-item-label>{{ worker.department.department.name }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="email" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.list.email') }} </q-item-label>
                                     <q-item-label>{{ worker.user.email }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item class="items-start cursor-pointer q-hoverable" v-if="worker.boss">
-                                <q-item-section side @click="openDescriptorDialog(worker.bossFk)">
-                                    <q-img :src="getWorkerAvatar()" class="avatar" />
-                                </q-item-section>
                                 <q-item-section @click="openDescriptorDialog(worker.bossFk)">
                                     <q-item-label caption>{{ t('worker.summary.boss') }} </q-item-label>
                                     <q-item-label>
@@ -153,9 +133,6 @@ function getWorkerAvatar() {
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="grid_3x3" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.summary.phoneExtension') }} </q-item-label>
                                     <q-item-label>
@@ -164,18 +141,12 @@ function getWorkerAvatar() {
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="phone" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.summary.entPhone') }} </q-item-label>
                                     <q-item-label>{{ worker.phone }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="phone_android" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.summary.personalPhone') }} </q-item-label>
                                     <q-item-label>{{ worker.client.phone }}</q-item-label>
@@ -189,36 +160,24 @@ function getWorkerAvatar() {
                                 {{ t('worker.summary.userData') }}
                             </q-item-label>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="grid_3x3" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption> {{ t('worker.summary.userId') }} </q-item-label>
                                     <q-item-label>{{ worker.user.id }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="person" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.card.name') }} </q-item-label>
                                     <q-item-label>{{ worker.user.nickname }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="group" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.summary.role') }} </q-item-label>
                                     <q-item-label>{{ worker.user.role.name }}</q-item-label>
                                 </q-item-section>
                             </q-item>
                             <q-item>
-                                <q-item-section side>
-                                    <q-icon name="extension" />
-                                </q-item-section>
                                 <q-item-section>
                                     <q-item-label caption>{{ t('worker.summary.sipExtension') }} </q-item-label>
                                     <q-item-label>{{ sipExtension() }}</q-item-label>
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 96918ecb2..622f858fd 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -52,21 +52,23 @@ function viewSummary(id) {
                 <q-card class="card" v-for="row in rows" :key="row.id">
                     <q-item class="q-pa-none items-start cursor-pointer q-hoverable" v-ripple clickable>
                         <q-item-section class="q-pa-md" @click="navigate(row.id)">
-                            <q-item-label caption>#{{ row.id }}</q-item-label>
                             <q-item-label class="text-h6">{{ row.user.nickname }}</q-item-label>
+                            <q-item-label caption>#{{ row.id }}</q-item-label>
                             <q-list>
                                 <q-item class="q-pa-none">
-                                    <q-item-section class="q-pa-md">
+                                    <q-item-section>
                                         <q-item-label caption>{{ t('worker.list.name') }}</q-item-label>
                                         <q-item-label>{{ row.user.name }}</q-item-label>
                                     </q-item-section>
-                                    <q-item-section class="q-pa-md">
+                                </q-item>
+                                <q-item class="q-pa-none">
+                                    <q-item-section>
                                         <q-item-label caption>{{ t('worker.list.email') }}</q-item-label>
                                         <q-item-label>{{ row.user.email }}</q-item-label>
                                     </q-item-section>
                                 </q-item>
                                 <q-item class="q-pa-none">
-                                    <q-item-section class="q-pa-md">
+                                    <q-item-section>
                                         <q-item-label caption>{{ t('worker.list.department') }}</q-item-label>
                                         <q-item-label>{{ row.department.department.name }}</q-item-label>
                                     </q-item-section>
diff --git a/src/router/modules/index.js b/src/router/modules/index.js
index dcb3fa5c2..ca8b3c958 100644
--- a/src/router/modules/index.js
+++ b/src/router/modules/index.js
@@ -2,10 +2,12 @@ import Customer from './customer';
 import Ticket from './ticket';
 import Claim from './claim';
 import InvoiceOut from './invoiceOut';
+import Worker from './worker';
 
 export default [
     Customer,
     Ticket,
     Claim,
-    InvoiceOut
+    InvoiceOut,
+    Worker
 ]
diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index 19d7acf4b..ddba83cfa 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -8,14 +8,14 @@ export default {
         icon: 'vn:worker',
     },
     component: RouterView,
-    redirect: { name: 'workerMain' },
+    redirect: { name: 'WorkerMain' },
     menus: {
-        main: ['workerMain'],
+        main: ['WorkerList'],
     },
     children: [
         {
             path: '',
-            name: 'workerMain',
+            name: 'WorkerMain',
             component: () => import('src/pages/Worker/WorkerMain.vue'),
             redirect: { name: 'WorkerList' },
             children: [
@@ -31,13 +31,13 @@ export default {
             ],
         },
         {
-            name: 'workerCard',
+            name: 'WorkerCard',
             path: ':id',
             component: () => import('src/pages/Worker/Card/WorkerCard.vue'),
             redirect: { name: 'WorkerSummary' },
             children: [
                 {
-                    name: 'workerSummary',
+                    name: 'WorkerSummary',
                     path: 'summary',
                     meta: {
                         title: 'summary',
diff --git a/src/stores/useNavigationStore.js b/src/stores/useNavigationStore.js
index 6d1a74326..3b2c7e8a7 100644
--- a/src/stores/useNavigationStore.js
+++ b/src/stores/useNavigationStore.js
@@ -6,7 +6,7 @@ import { useRole } from 'src/composables/useRole';
 import routes from 'src/router/modules';
 
 export const useNavigationStore = defineStore('navigationStore', () => {
-    const modules = ['customer', 'claim', 'ticket', 'invoiceOut'];
+    const modules = ['customer', 'claim', 'ticket', 'invoiceOut', 'worker'];
     const pinnedModules = ref([]);
     const role = useRole();