From 9bacfe8baa4b6cf4af82473bfd167b7401fe7be4 Mon Sep 17 00:00:00 2001
From: zzzdong <kuwater@163.com>
Date: Tue, 31 Dec 2024 14:35:55 +0800
Subject: [PATCH] feat(log-query): support display json field (#471)

---
 src/views/dashboard/logs/query/FormView.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/views/dashboard/logs/query/FormView.vue b/src/views/dashboard/logs/query/FormView.vue
index b4a81f03..e9ef8b90 100644
--- a/src/views/dashboard/logs/query/FormView.vue
+++ b/src/views/dashboard/logs/query/FormView.vue
@@ -10,14 +10,24 @@ a-descriptions(layout="vertical" bordered :column="1")
 <script setup name="FormView" type="ts">
   import useLogQueryStore from '@/store/modules/logquery';
 
+  const displayValue = (val, type) => {
+    switch (type) {
+      case 'json':
+        return JSON.stringify(val, null, 2)
+      default:
+        return val
+    }
+  }
+
   const props = defineProps(['data'])
   const { columns } = storeToRefs(useLogQueryStore())
   const formData = computed(() => {
     return Object.keys(props.data).filter((v) => v !== 'key').map((v) => {
+      const columnType = columns.value.filter(c => c.name === v)[0]?.data_type;
       return {
         label: v,
-        type: columns.value.filter(c => c.name === v)[0]?.data_type,
-        value: props.data[v]
+        type: columnType,
+        value: displayValue(props.data[v], columnType)
       }
     })
   })