src/pages/Worker/Card/WorkerDescriptor.vue

@@ -14,8 +14,8 @@ const $props = defineProps({
     },
 });
 
-onMounted(async () => {
-    await fetch();
+onMounted(() => {
+    fetch();
 });
 
 const route = useRoute();
@@ -53,13 +53,15 @@ const filter = {
 };
 
 async function fetch() {
-    const { data } = await axios.get(`Workers/${entityId.value}`, {
-        params: {
-            filter: JSON.stringify(filter),
-        },
-    });
-
-    if (data) worker.value = data;
+    axios
+        .get(`Workers/${entityId.value}`, {
+            params: {
+                filter: JSON.stringify(filter),
+            },
+        })
+        .then((response) => {
+            worker.value = response.data;
+        });
 }
 
 function sipExtension() {

src/pages/Worker/Card/WorkerSummary.vue

@@ -3,6 +3,7 @@ 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';
 
@@ -13,6 +14,7 @@ onUpdated(() => fetch());
 const route = useRoute();
 const { t } = useI18n();
 const quasar = useQuasar();
+const { getToken } = useSession();
 
 t == t;
 
@@ -84,6 +86,11 @@ function openDescriptorDialog(id) {
         },
     });
 }
+
+function getWorkerAvatar() {
+    const token = getToken();
+    return `/api/Images/user/160x160/${worker.value.boss.id}/download?access_token=${token}`;
+}
 </script>
 
 <template>
@@ -136,14 +143,12 @@ function openDescriptorDialog(id) {
                             </q-item>
                             <q-item class="items-start cursor-pointer q-hoverable" v-if="worker.boss">
                                 <q-item-section side @click="openDescriptorDialog(worker.bossFk)">
-                                    <q-icon name="person" />
+                                    <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>
-                                        <a>
-                                            {{ worker.boss.name }}
-                                        </a>
+                                        {{ worker.boss.name }}
                                     </q-item-label>
                                 </q-item-section>
                             </q-item>
@@ -227,6 +232,13 @@ function openDescriptorDialog(id) {
     </div>
 </template>
 <style lang="scss" scoped>
+.avatar {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    margin-right: 10px;
+}
+
 .container {
     display: flex;
     justify-content: center;

tests/cypress/integration/workerList.spec.js

@@ -0,0 +1,20 @@
+describe('WorkerList', () => {
+    beforeEach(() => {
+        cy.viewport(1280, 720)
+        cy.login('developer')
+        cy.visit('/#/worker/list');
+    });
+
+    it('should load workers', () => {
+        cy.get('div[class="q-item__label text-h6"]').eq(0).should('have.text', 'Jessica Jones');
+        cy.get('div[class="q-item__label text-h6"]').eq(1).should('have.text', 'Bruce Banner');
+        cy.get('div[class="q-item__label text-h6"]').eq(2).should('have.text', 'Charles Xavier');
+    });
+
+    it('should open the worker summary', () => {
+        cy.get('div[class="q-item__section column q-item__section--side justify-center q-pa-md"]').eq(0).click();
+        cy.get('div[class="header bg-primary q-pa-sm q-mb-md"').should('have.text', '1110 - Jessica');
+        cy.get('div[class="q-item__label q-item__label--header text-h6"]').eq(0).should('have.text', 'Basic data');
+        cy.get('div[class="q-item__label q-item__label--header text-h6"]').eq(1).should('have.text', 'User data');
+    });
+});

tests/cypress/integration/workerSummary.spec.js

@@ -0,0 +1,15 @@
+describe('WorkerSummary', () => {
+    beforeEach(() => {
+        cy.viewport(1280, 720)
+        cy.login('developer')
+        cy.visit('/#/worker/19/summary');
+    });
+
+    it('should load worker summary', () => {
+        cy.get('div[class="header bg-primary q-pa-sm q-mb-md"').should('have.text', '19 - salesBoss');
+        cy.get('div[class="q-item__label q-item__label--header text-h6"]').eq(0).should('have.text', 'Basic data');
+        cy.get('div[class="q-item__label q-item__label--header text-h6"]').eq(1).should('have.text', 'User data');
+        cy.get('div[class="q-item__section column q-item__section--main justify-center"]').eq(0).should('have.text', 'NamesalesBossNick');
+    });
+
+});