refs #5987 stateColor replaced

src/components/ui/VnLv.vue

@@ -13,11 +13,9 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
 <template>
     <div class="vn-label-value">
         <div v-if="$props.label || $slots.label" class="label">
-            <slot name="label">
-                {{ $props.label }}
-            </slot>
+            <slot name="label"> {{ $props.label }}</slot>
         </div>
-        <div class="value" v-if="$props.value || $slots.value" :title="$props.value">
+        <div v-if="$props.value || $slots.value" class="value">
             <span v-if="isBooleanValue">
                 <QIcon
                     :name="$props.value ? `check` : `close`"
@@ -25,21 +23,15 @@ const isBooleanValue = computed(() => typeof $props.value === 'boolean');
                 />
             </span>
             <span v-else>
-                <slot name="value">
-                    {{ $props.value }}
-                </slot>
-                <span class="info" v-if="$props.info">
-                    <QIcon name="info">
-                        <QTooltip
-                            class="text-white shadow-4"
-                            color="primary"
-                            :offset="[10, 10]"
-                        >
-                            {{ $props.info }}
-                        </QTooltip>
-                    </QIcon>
-                </span>
+                <slot name="value">{{ $props.value }}</slot>
             </span>
         </div>
+        <div class="info" v-if="$props.info">
+            <QIcon name="info">
+                <QTooltip class="bg-dark text-white shadow-4" :offset="[10, 10]">
+                    {{ $props.info }}
+                </QTooltip>
+            </QIcon>
+        </div>
     </div>
 </template>

src/pages/Ticket/TicketList.vue

@@ -18,34 +18,6 @@ const stateStore = useStateStore();
 onMounted(() => (stateStore.rightDrawer = true));
 onUnmounted(() => (stateStore.rightDrawer = false));
 
-const filter = {
-    include: [
-        {
-            relation: 'client',
-            scope: {
-                include: {
-                    relation: 'salesPersonUser',
-                    scope: {
-                        fields: ['name'],
-                    },
-                },
-            },
-        },
-        {
-            relation: 'ticketState',
-            scope: {
-                fields: ['stateFk', 'code', 'alertLevel'],
-                include: {
-                    relation: 'state',
-                    scope: {
-                        fields: ['name'],
-                    },
-                },
-            },
-        },
-    ],
-};
-
 const from = Date.vnNew();
 const to = Date.vnNew();
 to.setDate(to.getDate() + 1);
@@ -55,14 +27,6 @@ const userParams = {
     to: toDateString(to),
 };
 
-function stateColor(row) {
-    if (row.alertLevelCode === 'OK') return 'green';
-    if (row.alertLevelCode === 'FREE') return 'blue-3';
-    if (row.alertLevel === 1) return 'orange';
-    if (row.alertLevel === 0) return 'red';
-    return 'red';
-}
-
 function navigate(id) {
     router.push({ path: `/ticket/${id}` });
 }
@@ -112,7 +76,6 @@ function viewSummary(id) {
             <VnPaginate
                 data-key="TicketList"
                 url="Tickets/filter"
-                :filter="filter"
                 :user-params="userParams"
                 order="id DESC"
                 auto-load
@@ -143,7 +106,11 @@ function viewSummary(id) {
                                             </QItemLabel>
                                             <QItemLabel>
                                                 <QBadge
-                                                    :color="stateColor(row)"
+                                                    :color="
+                                                        row.classColor
+                                                            ? row.classColor
+                                                            : 'dark'
+                                                    "
                                                     class="q-ma-none"
                                                     dense
                                                 >