Commit 604d20f214f6675dffb8a175b28c054cdf3650e3
Merge remote-tracking branch 'origin/develop' into develop
Showing
2 changed files
with
72 additions
and
24 deletions
src/main/resources/templates/monitor/apilog/apilog.html
@@ -118,11 +118,15 @@ | @@ -118,11 +118,15 @@ | ||
118 | align: 'center', | 118 | align: 'center', |
119 | formatter: function (value, row, index) { | 119 | formatter: function (value, row, index) { |
120 | var actions = []; | 120 | var actions = []; |
121 | - actions.push('<a class="btn btn-success btn-xs " href="#" onclick="$.operate.detail(\'' + row.id + '\')">详情</a> '); | 121 | + actions.push('<a class="btn btn-success btn-xs " href="#" onclick="$.operate.detail(' + row.id + ')">详情</a> '); |
122 | return actions.join(''); | 122 | return actions.join(''); |
123 | } | 123 | } |
124 | }, | 124 | }, |
125 | { | 125 | { |
126 | + field: 'requestFrom', | ||
127 | + title: 'from' | ||
128 | + }, | ||
129 | + { | ||
126 | field: 'apiName', | 130 | field: 'apiName', |
127 | title: 'API' | 131 | title: 'API' |
128 | }, | 132 | }, |
@@ -132,10 +136,7 @@ | @@ -132,10 +136,7 @@ | ||
132 | title: 'IP' | 136 | title: 'IP' |
133 | }, | 137 | }, |
134 | **/ | 138 | **/ |
135 | - { | ||
136 | - field: 'requestFrom', | ||
137 | - title: 'from' | ||
138 | - }, | 139 | + |
139 | { | 140 | { |
140 | field: 'responseBy', | 141 | field: 'responseBy', |
141 | title: 'to' | 142 | title: 'to' |
@@ -212,7 +213,7 @@ | @@ -212,7 +213,7 @@ | ||
212 | var actions = []; | 213 | var actions = []; |
213 | if(value == undefined) | 214 | if(value == undefined) |
214 | value = " " | 215 | value = " " |
215 | - actions.push('<pre style="white-space: pre-wrap; width:400px" ondblclick="parseJson(this)" title="双击格式化">'+value+ '</pre>') | 216 | + actions.push('<pre style="white-space: pre-wrap; width:350px" ondblclick="copy(this)" title="双击复制">'+value+ '</pre>') |
216 | return actions.join(" ") | 217 | return actions.join(" ") |
217 | } | 218 | } |
218 | }, | 219 | }, |
@@ -229,7 +230,7 @@ | @@ -229,7 +230,7 @@ | ||
229 | var actions = []; | 230 | var actions = []; |
230 | if(value == undefined) | 231 | if(value == undefined) |
231 | value = " " | 232 | value = " " |
232 | - actions.push('<pre style="white-space: pre-wrap; width:400px" ondblclick="parseJson(this)" title="双击格式化">'+value+ '</pre>') | 233 | + actions.push('<pre style="white-space: pre-wrap; width:350px" ondblclick="copy(this)" title="双击复制">'+value+ '</pre>') |
233 | return actions.join(" ") | 234 | return actions.join(" ") |
234 | } | 235 | } |
235 | }, | 236 | }, |
@@ -250,15 +251,36 @@ | @@ -250,15 +251,36 @@ | ||
250 | $.table.init(options); | 251 | $.table.init(options); |
251 | }); | 252 | }); |
252 | 253 | ||
254 | + /** | ||
253 | function parseJson(obj){ | 255 | function parseJson(obj){ |
254 | var str = obj.innerHTML | 256 | var str = obj.innerHTML |
255 | try { | 257 | try { |
256 | str = JSON.parse(str); | 258 | str = JSON.parse(str); |
257 | - obj.outerHTML = '<pre style="white-space: pre-wrap; width:400px">' + JSON.stringify(str, null, 2) + '</pre>'; | 259 | + obj.outerHTML = '<pre style="white-space: pre-wrap; width:350px" ondblclick="unParse(this)">' + JSON.stringify(str, null, 2) + '</pre>'; |
258 | }catch (e) { | 260 | }catch (e) { |
259 | str = str.split("&").join(" ") | 261 | str = str.split("&").join(" ") |
260 | - obj.outerHTML = '<pre style="white-space: pre-wrap; width:400px">' + str + '</pre>'; | 262 | + obj.outerHTML = '<pre style="white-space: pre-wrap; width:350px" ondblclick="unParse(this)">' + str + '</pre>'; |
263 | + } | ||
264 | + } | ||
265 | + | ||
266 | + function unParse(obj) { | ||
267 | + var str = obj.innerHTML; | ||
268 | + | ||
269 | + obj.outerHTML = '<pre style="white-space: pre-wrap; width:350px" ondblclick="parseJson(this)" title="双击格式化">'+str.replaceAll("\n","")+ '</pre>' | ||
270 | + } | ||
271 | + **/ | ||
272 | + | ||
273 | + function copy(obj) { | ||
274 | + let transfer = document.createElement('textarea'); | ||
275 | + document.body.appendChild(transfer); | ||
276 | + transfer.value = obj.innerHTML; | ||
277 | + // transfer.focus(); | ||
278 | + transfer.select(); | ||
279 | + if (document.execCommand('copy')) { | ||
280 | + document.execCommand('copy'); | ||
261 | } | 281 | } |
282 | + transfer.blur(); | ||
283 | + document.body.removeChild(transfer); | ||
262 | } | 284 | } |
263 | </script> | 285 | </script> |
264 | </body> | 286 | </body> |
src/main/resources/templates/monitor/apilog/detail.html
@@ -13,6 +13,9 @@ | @@ -13,6 +13,9 @@ | ||
13 | .green{ | 13 | .green{ |
14 | color:green; | 14 | color:green; |
15 | } | 15 | } |
16 | + .hideCopy{ | ||
17 | + display: none; | ||
18 | + } | ||
16 | </style> | 19 | </style> |
17 | </head> | 20 | </head> |
18 | <body class="white-bg"> | 21 | <body class="white-bg"> |
@@ -28,7 +31,7 @@ | @@ -28,7 +31,7 @@ | ||
28 | </div> | 31 | </div> |
29 | <div class=""> | 32 | <div class=""> |
30 | <label class="col-sm-2 mylabel">请求方ip:</label> | 33 | <label class="col-sm-2 mylabel">请求方ip:</label> |
31 | - <label class="col-sm-10" th:text="${apiLog.getIp()}==null?' ':${apiLog.getIp()} + ' '"></label> | 34 | + <label class="col-sm-10" th:text="${#strings.defaultString(apiLog.getIp(), ' ')} + ' '"></label> |
32 | </div> | 35 | </div> |
33 | <div class=""> | 36 | <div class=""> |
34 | <label class="col-sm-2 mylabel">调用方向:</label> | 37 | <label class="col-sm-2 mylabel">调用方向:</label> |
@@ -36,15 +39,15 @@ | @@ -36,15 +39,15 @@ | ||
36 | </div> | 39 | </div> |
37 | <div class=""> | 40 | <div class=""> |
38 | <label class="col-sm-2 mylabel">Method:</label> | 41 | <label class="col-sm-2 mylabel">Method:</label> |
39 | - <label class="col-sm-10" th:text="${apiLog.getApiMethod()}"></label> | 42 | + <label class="col-sm-10" th:text="${#strings.defaultString(apiLog.getApiMethod(),' ')}"></label> |
40 | </div> | 43 | </div> |
41 | <div class=""> | 44 | <div class=""> |
42 | <label class="col-sm-2 mylabel">接口地址:</label> | 45 | <label class="col-sm-2 mylabel">接口地址:</label> |
43 | - <label class="col-sm-10" th:text="${apiLog.getUrl()}"></label> | 46 | + <label class="col-sm-10" th:text="${#strings.defaultString(apiLog.getUrl(), ' ')}"></label> |
44 | </div> | 47 | </div> |
45 | <div class=""> | 48 | <div class=""> |
46 | <label class="col-sm-2 mylabel">请求时间:</label> | 49 | <label class="col-sm-2 mylabel">请求时间:</label> |
47 | - <label class="col-sm-10" th:text="${#dates.format(apiLog.requestTime, 'yyyy-MM-dd HH:mm:ss')}"></label> | 50 | + <label class="col-sm-10" th:text="${#strings.defaultString(#dates.format(apiLog.requestTime, 'yyyy-MM-dd HH:mm:ss'), ' ')}"></label> |
48 | </div> | 51 | </div> |
49 | <!--<div class="">--> | 52 | <!--<div class="">--> |
50 | <!--<label class="col-sm-2 mylabel">响应时间:</label>--> | 53 | <!--<label class="col-sm-2 mylabel">响应时间:</label>--> |
@@ -52,31 +55,36 @@ | @@ -52,31 +55,36 @@ | ||
52 | <!--</div>--> | 55 | <!--</div>--> |
53 | <div class="" th:classappend="${apiLog.getDuration()}>=1000?'red'"> | 56 | <div class="" th:classappend="${apiLog.getDuration()}>=1000?'red'"> |
54 | <label class="col-sm-2 mylabel">耗时:</label> | 57 | <label class="col-sm-2 mylabel">耗时:</label> |
55 | - <label class="col-sm-10" th:text="${apiLog.getDuration()} + ' 毫秒'"></label> | 58 | + <label class="col-sm-10" th:text="${#strings.defaultString(apiLog.getDuration(), ' ')} + ' 毫秒'"></label> |
56 | </div> | 59 | </div> |
57 | <div class="" th:classappend="${apiLog.getHttpCode()}=='200'?'green':'red'"> | 60 | <div class="" th:classappend="${apiLog.getHttpCode()}=='200'?'green':'red'"> |
58 | <label class="col-sm-2 mylabel">HttpCode:</label> | 61 | <label class="col-sm-2 mylabel">HttpCode:</label> |
59 | - <label class="col-sm-10" th:text="${apiLog.getHttpCode()}==null?' ':${apiLog.getHttpCode()}"></label> | 62 | + <label class="col-sm-10" th:text="${#strings.defaultString(apiLog.getHttpCode(), ' ')}"></label> |
60 | </div> | 63 | </div> |
61 | <div class="" th:classappend="${apiLog.getRetCode()}=='200'?'green':'red'"> | 64 | <div class="" th:classappend="${apiLog.getRetCode()}=='200'?'green':'red'"> |
62 | <label class="col-sm-2 mylabel">RetCode:</label> | 65 | <label class="col-sm-2 mylabel">RetCode:</label> |
63 | - <label class="col-sm-10" th:text="${apiLog.getRetCode()}==null?' ':${apiLog.getRetCode()}"></label> | 66 | + <label class="col-sm-10" th:text="${#strings.defaultString(apiLog.getRetCode(), ' ')}"></label> |
64 | </div> | 67 | </div> |
65 | <div class=""> | 68 | <div class=""> |
66 | - <label class="col-sm-2 mylabel">请求头:</label> | ||
67 | - <div class="col-sm-10"><pre style="white-space: pre-wrap;" th:text="${apiLog.getRequestHeader()}"></pre></div> | 69 | + <label class="col-sm-2 mylabel">请求头: |
70 | + </label> | ||
71 | + <div class="col-sm-9"><pre id="reqHeader" style="white-space: pre-wrap;" th:text="${apiLog.getRequestHeader()}"></pre></div> | ||
72 | + <div class="col-sm-1 "><a class="btn btn-success btn-xs" th:classappend="${#strings.isEmpty(apiLog.getRequestHeader())}?' hideCopy':''" href="javacript:void(0);" onclick="copy('reqHeader')">复制</a></div> | ||
68 | </div> | 73 | </div> |
69 | <div class=""> | 74 | <div class=""> |
70 | <label class="col-sm-2 mylabel">响应头:</label> | 75 | <label class="col-sm-2 mylabel">响应头:</label> |
71 | - <div class="col-sm-10"><pre style="white-space: pre-wrap;" th:text="${apiLog.getResponseHeader()}"></pre></div> | 76 | + <div class="col-sm-9"><pre id="respHeader" style="white-space: pre-wrap;" th:text="${apiLog.getResponseHeader()}"></pre></div> |
77 | + <div class="col-sm-1 "><a class="btn btn-success btn-xs" th:classappend="${#strings.isEmpty(apiLog.getResponseHeader())}?' hideCopy':''" href="javacript:void(0);" onclick="copy('respHeader')">复制</a></div> | ||
72 | </div> | 78 | </div> |
73 | <div class=""> | 79 | <div class=""> |
74 | <label class="col-sm-2 mylabel">请求内容:</label> | 80 | <label class="col-sm-2 mylabel">请求内容:</label> |
75 | - <div class="col-sm-10"><pre id="preReqBody" style="white-space: pre-wrap;" th:text="${apiLog.getRequestBody()}"></pre></div> | 81 | + <div class="col-sm-9"><pre id="reqBody" style="white-space: pre-wrap;" th:text="${apiLog.getRequestBody()}"></pre></div> |
82 | + <div class="col-sm-1 "><a class="btn btn-success btn-xs" th:classappend="${#strings.isEmpty(apiLog.getRequestBody())}?' hideCopy':''" href="javacript:void(0);" onclick="copy('reqBody')">复制</a></div> | ||
76 | </div> | 83 | </div> |
77 | <div class=""> | 84 | <div class=""> |
78 | <label class="col-sm-2 mylabel">响应内容:</label> | 85 | <label class="col-sm-2 mylabel">响应内容:</label> |
79 | - <div class="col-sm-10"><pre id="preRespBody" style="white-space: pre-wrap;" th:text="${apiLog.getResponseBody()}"></pre></div> | 86 | + <div class="col-sm-9"><pre id="respBody" style="white-space: pre-wrap;" th:text="${apiLog.getResponseBody()}"></pre></div> |
87 | + <div class="col-sm-1 "><a class="btn btn-success btn-xs" th:classappend="${#strings.isEmpty(apiLog.getResponseBody())}?' hideCopy':''" href="javacript:void(0);" onclick="copy('respBody')">复制</a></div> | ||
80 | </div> | 88 | </div> |
81 | <!--<div class="">--> | 89 | <!--<div class="">--> |
82 | <!--<label class="col-sm-2 mylabel">httpCode:</label>--> | 90 | <!--<label class="col-sm-2 mylabel">httpCode:</label>--> |
@@ -89,7 +97,8 @@ | @@ -89,7 +97,8 @@ | ||
89 | <!--</div>--> | 97 | <!--</div>--> |
90 | <div class="" th:classappend="${apiLog.getException()}!=null?'red'"> | 98 | <div class="" th:classappend="${apiLog.getException()}!=null?'red'"> |
91 | <label class="col-sm-2 mylabel">异常信息:</label> | 99 | <label class="col-sm-2 mylabel">异常信息:</label> |
92 | - <div class="col-sm-10"><pre style="white-space: pre-wrap;" th:text="${apiLog.getException()}"></pre></div> | 100 | + <div class="col-sm-9"><pre id="exception" style="white-space: pre-wrap;" th:text="${apiLog.getException()}"></pre></div> |
101 | + <div class="col-sm-1 "><a class="btn btn-success btn-xs" th:classappend="${#strings.isEmpty(apiLog.getException())}?' hideCopy':''" href="javacript:void(0);" onclick="copy('exception')">复制</a></div> | ||
93 | </div> | 102 | </div> |
94 | </div> | 103 | </div> |
95 | </div> | 104 | </div> |
@@ -108,8 +117,25 @@ | @@ -108,8 +117,25 @@ | ||
108 | } | 117 | } |
109 | } | 118 | } |
110 | 119 | ||
111 | - parseJson(document.getElementById("preReqBody")) | ||
112 | - parseJson(document.getElementById("preRespBody")) | 120 | + parseJson(document.getElementById("reqBody")) |
121 | + parseJson(document.getElementById("respBody")) | ||
122 | + | ||
123 | + function copy(id) { | ||
124 | + var obj = document.getElementById(id) | ||
125 | + if(obj.innerHTML == "") | ||
126 | + return; | ||
127 | + let transfer = document.createElement('textarea'); | ||
128 | + document.body.appendChild(transfer); | ||
129 | + transfer.value = obj.innerHTML; | ||
130 | + // transfer.focus(); | ||
131 | + transfer.select(); | ||
132 | + if (document.execCommand('copy')) { | ||
133 | + document.execCommand('copy'); | ||
134 | + } | ||
135 | + transfer.blur(); | ||
136 | + document.body.removeChild(transfer); | ||
137 | + $.modal.alertSuccess("复制成功"); | ||
138 | + } | ||
113 | </script> | 139 | </script> |
114 | </body> | 140 | </body> |
115 | </html> | 141 | </html> |
116 | \ No newline at end of file | 142 | \ No newline at end of file |