Display level as colored chip

src/components/Grid/Main/ErrLevelRenderer.js

@@ -0,0 +1,26 @@
+import { VChip } from 'vuetify/components/VChip'
+
+export default {
+    template: `<v-chip
+        class="ma-2"
+        :color="color"
+        text-color="white"
+    >
+    {{ displayValue }}
+    </v-chip>`,
+    components: {
+        VChip
+    },
+    setup(props) {
+        let displayValue = props.params.value
+        let colors = {
+            'error': 'red',
+            'info': 'orange',
+        }
+        let color = colors[displayValue]
+        return {
+            displayValue,
+            color
+        };
+    },
+};

src/components/Grid/Main/config.js

@@ -53,6 +53,7 @@ const config = {
         },
         {
             field: 'level',
+            cellRenderer: 'ErrLevelRenderer',
         },
     ],
 }

src/components/LogViewer.vue

@@ -34,6 +34,7 @@ import "ag-grid-community/styles//ag-theme-material.css";
 import { VBtn } from 'vuetify/components/VBtn'
 import ExamineLogModal from "./Modal/ExamineLogModal.vue";
 import ComboboxFilter from "./Filter/ComboboxFilter.js";
+import ErrLevelRenderer from "./Grid/Main/ErrLevelRenderer";
 import flattenObj from "../helpers/flattenObj";
 import parseEventData from "../helpers/parseEventData";
 import {mapActions, mapGetters} from 'vuex';
@@ -44,6 +45,7 @@ export default {
     ExamineLogModal,
     AgGridVue,
     ComboboxFilter,
+    ErrLevelRenderer,
     VBtn
   },
   data() {