style: 让AI API Log中Content内容使用JSON格式展示

src/auto-imports.d.ts

@@ -3,6 +3,7 @@
 // @ts-nocheck
 // noinspection JSUnusedGlobalSymbols
 // Generated by unplugin-auto-import
+// biome-ignore lint: disable
 export {}
 declare global {
   const $api: typeof import('@/api/index')['default']
@@ -68,6 +69,6 @@ declare global {
 // for type re-export
 declare global {
   // @ts-ignore
-  export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
+  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
   import('vue')
 }

src/views/AIApiLog/src/components/LogDialog.vue

@@ -4,47 +4,6 @@ import 'vue-json-pretty/lib/styles.css'
 
 const dialogVisible = ref(false)
 
-const test = {
-  id: 'msg_01LxDyhUhqWiN5TT4Bopg9Qn',
-  type: 'message',
-  role: 'assistant',
-  model: 'claude-3-7-sonnet-20250219',
-  content: [
-    {
-      type: 'text',
-      text: '{\n  "can_query": "false",\n  "reason": "用户的问题 \'how about Xiamen?\' 过于简短和模糊，无法确定具体的查询意图。用户可能是想查询与厦门(Xiamen)相关的货物运输信息，但没有提供任何具体的参考号码(如提单号、集装箱号、订舱号等)或其他查询条件。",\n  "response": "I\'d be happy to provide information about shipments to or from Xiamen, but I need more specific details to assist you better. \n\nCould you please provide:\n- A specific reference number (like a bill of lading, container number, or booking number)\n- Or clarify what exactly you\'d like to know about Xiamen shipments?\n\nFor example, you might be looking for:\n- Shipments currently en route to/from Xiamen\n- Shipping schedules for Xiamen\n- Transit times to/from Xiamen\n\nWith more details, I can provide you with the specific information you need."\n}'
-    }
-  ],
-  stop_reason: 'end_turn',
-  stop_sequence: null,
-  usage: {
-    input_tokens: 4490,
-    cache_creation_input_tokens: 0,
-    cache_read_input_tokens: 0,
-    output_tokens: 266,
-    service_tier: 'standard'
-  },
-  id1: 'msg_01LxDyhUhqWiN5TT4Bopg9Qn',
-  type1: 'message',
-  ro1le: 'assistant',
-  model1: 'claude-3-7-sonnet-20250219',
-  cont1ent: [
-    {
-      type: 'text',
-      text: '{\n  "can_query": "false",\n  "reason": "用户的问题 \'how about Xiamen?\' 过于简短和模糊，无法确定具体的查询意图。用户可能是想查询与厦门(Xiamen)相关的货物运输信息，但没有提供任何具体的参考号码(如提单号、集装箱号、订舱号等)或其他查询条件。",\n  "response": "I\'d be happy to provide information about shipments to or from Xiamen, but I need more specific details to assist you better. \n\nCould you please provide:\n- A specific reference number (like a bill of lading, container number, or booking number)\n- Or clarify what exactly you\'d like to know about Xiamen shipments?\n\nFor example, you might be looking for:\n- Shipments currently en route to/from Xiamen\n- Shipping schedules for Xiamen\n- Transit times to/from Xiamen\n\nWith more details, I can provide you with the specific information you need."\n}'
-    }
-  ],
-  st1op_reason: 'end_turn',
-  sto1p_sequence: null,
-  us1age: {
-    input_tokens: 4490,
-    cache_creation_input_tokens: 0,
-    cache_read_input_tokens: 0,
-    output_tokens: 266,
-    service_tier: 'standard'
-  }
-}
-
 const requestContent = ref()
 const responseContent = ref()
 const requestContentRef = ref<HTMLElement | null>(null)
@@ -90,7 +49,7 @@ defineExpose({
     <div class="response-section">
       <div class="title">Response Content</div>
       <div class="content" :style="{ height: responseHeight + 'px' }">
-        <vue-json-pretty :data="test" :deep="4" />
+        <vue-json-pretty :data="responseContent" :deep="4" />
       </div>
     </div>
   </el-dialog>