1 files changed, 35 insertions, 0 deletions

diff --git a/src/components/group/Message.vue b/src/components/group/Message.vue
new file mode 100644
index 0000000..56e2805
--- /dev/null
+++ b/src/components/group/Message.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="message">
+      <div class="sender">{{ get_message_user }}</div>
+      <div class="content">{{ get_message_content }}</div>
+      <div class="date">{{ get_message_date }}</div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    message: Object
+  },
+
+  computed: {
+    get_message_user() { return this.message.sender.username },
+    get_message_content() { return this.message.message },
+    get_message_date() {
+      let date = new Date(this.message.create_date)
+      return `${date.getDate()}/${date.getMonth()} ${date.getHours()}:${date.getMinutes()}`
+    },
+  },
+
+  created() {
+    this.$nextTick(function () {
+    })
+  }
+}
+</script>
+
+<style scoped>
+.message {
+  width: 100%;
+}
+</style>