chat

2022-01-31 14:21:50 +08:00
parent 2906012920
commit e3db4d2f29
5 changed files with 242 additions and 61 deletions
--- a/components/DialogueList.vue
+++ b/components/DialogueList.vue
@@ -0,0 +1,50 @@
+<template lang="pug">
+.dialogue-list
+  .post(v-for="item in data", :key="item._id")
+    .left
+      .avatar
+    .right
+      .name Last
+      .message {{ item.data }}
+</template>
+
+<script>
+export default {
+  props: ["data"],
+};
+</script>
+
+<style lang="sass" scoped>
+.dialogue-list
+  .post
+    display: flex
+    margin: 1rem 0
+    .left
+      justify-content: center
+      align-items: center
+      .avatar
+        width: 2rem
+        height: 2rem
+        background: #ccc
+        border-radius: 50%
+        margin: .5rem auto
+    .right
+      padding: 0 2rem
+      .name
+        color: #999
+        font-size: .8rem
+      .message
+        background: #ffffff
+        padding: 1rem
+        border-radius: 1rem
+        position: relative
+
+        &::before
+          content: ""
+          position: absolute
+          top: 10px
+          left: -1rem
+          border-top: 20px solid #ffffff
+          border-left: 1rem solid transparent
+          border-right: 1rem solid transparent
+</style>