From 71b68572808054c563cceae18e813dceeab6cec8 Mon Sep 17 00:00:00 2001
From: Hironsan <light.tree.1.13@gmail.com>
Date: Wed, 16 Oct 2019 22:58:29 +0900
Subject: [PATCH] Add metadata box

---
 frontend/components/organisms/MetadataBox.vue | 55 +++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 frontend/components/organisms/MetadataBox.vue

diff --git a/frontend/components/organisms/MetadataBox.vue b/frontend/components/organisms/MetadataBox.vue
new file mode 100644
index 00000000..f6bb6658
--- /dev/null
+++ b/frontend/components/organisms/MetadataBox.vue
@@ -0,0 +1,55 @@
+<template>
+  <v-card>
+    <v-data-table
+      :headers="headers"
+      :items="metaArray"
+      item-key="key"
+      hide-default-footer
+      disable-pagination
+      class="elevation-1"
+    >
+    </v-data-table>
+  </v-card>
+</template>
+
+<script>
+export default {
+  props: {
+    metadata: {
+      type: Object,
+      default: () => ({}),
+      required: true
+    }
+  },
+
+  data() {
+    return {
+      headers: [
+        {
+          text: 'Key',
+          align: 'left',
+          value: 'key'
+        },
+        {
+          text: 'Value',
+          align: 'left',
+          value: 'value'
+        }
+      ]
+    }
+  },
+
+  computed: {
+    metaArray() {
+      const items = []
+      for (const [key, value] of Object.entries(this.metadata)) {
+        items.push({
+          key,
+          value
+        })
+      }
+      return items
+    }
+  }
+}
+</script>