From 72c0f86c75c8a9a5eb7435d72b6ebece4c5382e8 Mon Sep 17 00:00:00 2001
From: wanshenmean <cathay_xy@163.com>
Date: 星期二, 14 四月 2026 18:21:27 +0800
Subject: [PATCH] feat: 添加vue3-json-viewer并优化日志显示
---
Code/WMS/WIDESEA_WMSClient/src/extension/system/Mes_Log.jsx | 78 ++++++++++++++++++---------------------
1 files changed, 36 insertions(+), 42 deletions(-)
diff --git a/Code/WMS/WIDESEA_WMSClient/src/extension/system/Mes_Log.jsx b/Code/WMS/WIDESEA_WMSClient/src/extension/system/Mes_Log.jsx
index be25098..560c165 100644
--- a/Code/WMS/WIDESEA_WMSClient/src/extension/system/Mes_Log.jsx
+++ b/Code/WMS/WIDESEA_WMSClient/src/extension/system/Mes_Log.jsx
@@ -1,5 +1,7 @@
-import { h, createApp } from 'vue';
-import { ElDrawer, ElIcon } from 'element-plus';
+import { createApp } from 'vue';
+import { ElDrawer } from 'element-plus';
+import { JsonViewer } from 'vue3-json-viewer';
+import 'vue3-json-viewer/dist/vue3-json-viewer.css';
let extension = {
components: {
@@ -54,13 +56,12 @@
const jsonContent = type === 'request' ? row.requestJson : row.responseJson;
const title = type === 'request' ? '馃搵 璇锋眰 JSON' : '馃摜 鍝嶅簲 JSON';
- // 鏍煎紡鍖� JSON
- let formattedJson = '';
+ // 瑙f瀽 JSON 瀵硅薄锛岃В鏋愬け璐ュ垯淇濈暀鍘熷瀛楃涓�
+ let jsonData;
try {
- const obj = typeof jsonContent === 'string' ? JSON.parse(jsonContent) : jsonContent;
- formattedJson = JSON.stringify(obj, null, 2);
+ jsonData = typeof jsonContent === 'string' ? JSON.parse(jsonContent) : jsonContent;
} catch (e) {
- formattedJson = String(jsonContent);
+ jsonData = String(jsonContent);
}
// 鍒涘缓涓存椂瀹瑰櫒娓叉煋鎶藉眽
@@ -69,45 +70,38 @@
const app = createApp({
render() {
- return h('div', [
- h(ElDrawer, {
- modelValue: true,
- 'onUpdate:modelValue': (val) => {
- if (!val) {
- app.unmount();
- document.body.removeChild(container);
- }
- },
- title: title,
- size: '30%',
- destroyOnClose: true,
- closeOnClickModal: true
- }, {
- default: () => h('div', {
- style: {
- height: '100%',
- backgroundColor: '#f5f5f5',
- padding: '16px',
- borderRadius: '4px'
- }
- }, [
- h('pre', {
- style: {
- margin: '0',
- fontSize: '14px',
- lineHeight: '1.5',
- fontFamily: 'Consolas, Monaco, "Courier New", monospace',
- whiteSpace: 'pre-wrap',
- wordBreak: 'break-all'
- }
- }, formattedJson)
- ])
- })
- ]);
+ const onClose = (val) => {
+ if (!val) {
+ app.unmount();
+ document.body.removeChild(container);
+ }
+ };
+ return (
+ <div>
+ <ElDrawer
+ modelValue={true}
+ onUpdate:modelValue={onClose}
+ title={title}
+ size="30%"
+ destroyOnClose={true}
+ closeOnClickModal={true}
+ >
+ <JsonViewer
+ value={jsonData}
+ expanded={true}
+ expandDepth={5}
+ copyable={true}
+ sort={false}
+ theme="light"
+ />
+ </ElDrawer>
+ </div>
+ );
}
});
app.use(window.ElementPlus);
+ app.component('JsonViewer', JsonViewer);
app.mount(container);
},
}
--
Gitblit v1.9.3