From fcdfd8d3236c8d943f47a018acd7b6132508c4ed Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Mon, 4 Mar 2019 09:16:24 +0900
Subject: [PATCH] Use vue-json-pretty

---
 package.json                        |  1 +
 src/client/app/admin/views/logs.vue | 10 +++++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index d0a0f76f6..bec075b97 100644
--- a/package.json
+++ b/package.json
@@ -235,6 +235,7 @@
 		"vue-cropperjs": "3.0.0",
 		"vue-i18n": "8.8.2",
 		"vue-js-modal": "1.3.28",
+		"vue-json-pretty": "1.4.1",
 		"vue-loader": "15.7.0",
 		"vue-marquee-text-component": "1.1.1",
 		"vue-prism-component": "1.1.1",
diff --git a/src/client/app/admin/views/logs.vue b/src/client/app/admin/views/logs.vue
index 9a06d89ba..120a79cab 100644
--- a/src/client/app/admin/views/logs.vue
+++ b/src/client/app/admin/views/logs.vue
@@ -20,7 +20,10 @@
 
 			<div class="nqjzuvev">
 				<code v-for="log in logs" :key="log._id" :class="log.level">
-					<mk-time :time="log.createdAt"/> [{{ log.domain.join('.') }}] {{ log.message }}
+					<details>
+						<summary><mk-time :time="log.createdAt"/> [{{ log.domain.join('.') }}] {{ log.message }}</summary>
+						<vue-json-pretty v-if="log.data" :data="log.data"></vue-json-pretty>
+					</details>
 				</code>
 			</div>
 		</section>
@@ -32,10 +35,15 @@
 import Vue from 'vue';
 import i18n from '../../i18n';
 import { faStream } from '@fortawesome/free-solid-svg-icons';
+import VueJsonPretty from 'vue-json-pretty';
 
 export default Vue.extend({
 	i18n: i18n('admin/views/logs.vue'),
 
+	components: {
+		VueJsonPretty
+	},
+
 	data() {
 		return {
 			logs: [],