Merge branch 'dev' into 6325-tasaClaim

src/components/common/VnLog.vue

@@ -168,17 +168,17 @@ function getLogTree(data) {
     let originLog = null;
     let userLog = null;
     let modelLog = null;
-    let prevLog;
     let nLogs;
 
-    data.forEach((log) => {
+    for (let i = 0; i < data.length; i++) {
+        let log = data[i];
+        let prevLog = i > 0 ? data[i - 1] : null;
         const locale = validations[log.changedModel]?.locale || {};
 
         // Origin
         const originChanged = !prevLog || log.originFk != prevLog.originFk;
         if (originChanged) {
             logs.push((originLog = { originFk: log.originFk, logs: [] }));
-            prevLog = log;
         }
         // User
         const userChanged = originChanged || log.userFk != prevLog.userFk;
@@ -197,6 +197,7 @@ function getLogTree(data) {
             log.changedModel != prevLog.changedModel ||
             log.changedModelId != prevLog.changedModelId ||
             nLogs >= 6;
+
         if (modelChanged) {
             userLog.logs.push(
                 (modelLog = {
@@ -221,7 +222,7 @@ function getLogTree(data) {
         propNames = [...new Set(propNames)];
 
         log.props = parseProps(propNames, locale, vals, olds);
-    });
+    }
     return logs;
 }
 
@@ -320,7 +321,6 @@ function selectFilter(type, dateType) {
     }
     if (type === 'action' && selectedFilters.value.changedModel === null) {
         selectedFilters.value.changedModel = undefined;
-        reload = false;
     }
     if (type === 'userRadio') {
         selectedFilters.value.userFk = userRadio.value;
@@ -415,18 +415,19 @@ setLogTree();
             <div class="line bg-grey"></div>
         </QItem>
         <div
-            class="user-log q-mb-sm row"
+            class="user-log q-mb-sm"
             v-for="(userLog, userIndex) in originLog.logs"
             :key="userIndex"
         >
             <div class="timeline">
                 <div class="user-avatar">
-                    <VnUserLink v-if="userLog.user.image" :worker-id="userLog.user.id">
+                    <VnUserLink :worker-id="userLog.user.id">
                         <template #link>
                             <VnAvatar
                                 :class="{ 'cursor-pointer': userLog.user.id }"
                                 :worker-id="userLog.user.id"
                                 :title="userLog.user.nickname"
+                                size="lg"
                             />
                         </template>
                     </VnUserLink>
@@ -665,7 +666,6 @@ setLogTree();
                         option-label="locale"
                         :options="actions"
                         @update:model-value="selectFilter('action')"
-                        @clear="() => selectFilter('action')"
                         hide-selected
                     />
                 </QItem>
@@ -823,14 +823,30 @@ setLogTree();
 .q-item {
     min-height: 0px;
 }
+.q-menu {
+    display: block;
 
+    & > .loading {
+        display: flex;
+        justify-content: center;
+    }
+    & > .q-card {
+        min-width: 180px;
+        max-width: 400px;
+
+        & > .header {
+            color: $dark;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+        }
+    }
+}
 .origin-log {
     &:first-child > .origin-info {
         margin-top: 0;
     }
     & > .origin-info {
-        width: 100%;
-        max-width: 42em;
         margin-top: 28px;
         gap: 6px;
 
@@ -847,14 +863,15 @@ setLogTree();
     }
 }
 .user-log {
+    display: flex;
     width: 100%;
     max-width: 40em;
-
     & > .timeline {
         position: relative;
-        padding-right: 5px;
+        padding-right: 1px;
-        width: 50px;
+        width: 38px;
         min-width: 38px;
+        flex-grow: auto;
         & > .arrow {
             height: 8px;
             width: 8px;
@@ -874,7 +891,7 @@ setLogTree();
             position: absolute;
             background-color: $primary;
             width: 2px;
-            left: 23px;
+            left: 19px;
             z-index: -1;
             top: 0;
             bottom: -8px;
@@ -893,6 +910,7 @@ setLogTree();
         overflow: hidden;
         white-space: nowrap;
         text-overflow: ellipsis;
+        min-height: 22px;
         .model-value {
             font-style: italic;
         }
@@ -984,25 +1002,6 @@ setLogTree();
         }
     }
 }
-.q-menu {
-    display: block;
-
-    & > .loading {
-        display: flex;
-        justify-content: center;
-    }
-    & > .q-card {
-        min-width: 180px;
-        max-width: 400px;
-
-        & > .header {
-            color: $dark;
-            overflow: hidden;
-            white-space: nowrap;
-            text-overflow: ellipsis;
-        }
-    }
-}
 </style>
 <i18n>
 en:

src/components/ui/CardDescriptor.vue

@@ -1,8 +1,7 @@
 <script setup>
-import { onMounted, useSlots, ref, watch, computed } from 'vue';
+import { onMounted, useSlots, watch, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
-import axios from 'axios';
 import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
 import { useArrayData } from 'composables/useArrayData';
 

src/components/ui/VnAvatar.vue

@@ -1,19 +1,37 @@
 <script setup>
+import { computed, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
 import { useSession } from 'src/composables/useSession';
+import { useColor } from 'src/composables/useColor';
 
 const $props = defineProps({
     workerId: { type: Number, required: true },
     description: { type: String, default: null },
+    size: { type: String, default: null },
+    title: { type: String, default: null },
 });
 const session = useSession();
 const token = session.getToken();
+const { t } = useI18n();
+
+const title = computed(() => $props.title ?? t('globals.system'));
+const showLetter = ref(false);
 </script>
 <template>
     <div class="avatar-picture column items-center">
-        <QAvatar color="orange">
+        <QAvatar
+            :style="{
+                backgroundColor: useColor(title),
+            }"
+            :size="$props.size"
+            :title="title"
+        >
+            <template v-if="showLetter">{{ title.charAt(0) }}</template>
             <QImg
+                v-else
                 :src="`/api/Images/user/160x160/${$props.workerId}/download?access_token=${token}`"
                 spinner-color="white"
+                @error="showLetter = true"
             />
         </QAvatar>
         <div class="description">

src/pages/Claim/ClaimList.vue

@@ -89,18 +89,20 @@ function viewSummary(id) {
                         <template #list-items>
                             <VnLv :label="t('claim.list.customer')" @click.stop>
                                 <template #value>
-                                    <span class="link">
+                                    <span class="link" @click.stop>
                                         {{ row.clientName }}
                                         <CustomerDescriptorProxy :id="row.clientFk" />
                                     </span>
                                 </template>
                             </VnLv>
-                            <VnLv :label="t('claim.list.assignedTo')" @click.stop>
+                            <VnLv :label="t('claim.list.assignedTo')">
                                 <template #value>
+                                    <span @click.stop>
                                         <VnUserLink
                                             :name="row.workerName"
                                             :worker-id="row.workerFk"
                                         />
+                                    </span>
                                 </template>
                             </VnLv>
                             <VnLv

src/pages/InvoiceIn/InvoiceInList.vue

@@ -76,7 +76,6 @@ function viewSummary(id) {
                 data-key="InvoiceInList"
                 url="InvoiceIns/filter"
                 order="issued DESC, id DESC"
-                auto-load
             >
                 <template #body="{ rows }">
                     <CardList

test/cypress/integration/invoiceIn/invoiceInList.spec.js

@@ -9,6 +9,7 @@ describe('InvoiceInList', () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/invoice-in`);
+        cy.clickFilterSearchBtn();
     });
 
     it('should redirect on clicking a invoice', () => {

test/cypress/support/commands.js

@@ -183,4 +183,8 @@ Cypress.Commands.add('writeSearchbar', (value) => {
 Cypress.Commands.add('validateContent', (selector, expectedValue) => {
     cy.get(selector).should('have.text', expectedValue);
 });
+
+Cypress.Commands.add('clickFilterSearchBtn', () => {
+    cy.get('.q-item__section > .q-btn > .q-btn__content > .q-icon').click();
+});
 // registerCommands();