DEBUG

components/Model/BoxNone.vue

@@ -0,0 +1,65 @@
+<template lang="pug">
+.model-box-none
+  .wrap
+    .cube
+      .front
+      .back
+      .left
+      .right
+      .top
+      .bottom
+</template>
+
+<style lang="sass">
+.model-box-none
+  .wrap
+    height: 200px
+    margin-top: 80px
+    perspective: 1000px
+    perspective-origin: 50% 50%
+    border-radius: .5rem
+    .cube
+      position: relative
+      width: 8rem
+      height: 8rem
+      margin: 0 auto
+      transform-style: preserve-3d
+      animation: box 15s linear infinite
+      transform: rotateX(350deg) rotateY(350deg)
+      div
+        position: absolute
+        top: 0
+        left: 0
+        opacity: 0.8
+        width: 100%
+        height: 100%
+        font-size: 1.25rem
+        color: white
+        text-align: center
+        line-height: 200px
+        transition: transform .75s ease-in
+      .front
+        background: rgba(0, 0, 0, .05)
+        background-size: auto 100%
+        transform: translateZ(100px)
+      .back
+        background: rgba(0, 0, 0, .05)
+        background-size: auto 100%
+        transform: translateZ(-100px) rotateY(180deg)
+      .right
+        background: rgba(0, 0, 0, .05)
+        background-size: auto 100%
+        transform: rotateY(90deg) translateZ(100px)
+      .left
+        background: rgba(0, 0, 0, .05)
+        background-size: auto 100%
+        transform: rotateY(-90deg) translateZ(100px)
+      .top
+        background: rgba(0, 0, 0, .05)
+        background-size: auto 100%
+        transform: rotateX(90deg) translateZ(100px)
+      .bottom
+        background: rgba(0, 0, 0, .05)
+        background-size: auto 100%
+        transform: rotateX(-90deg) translateZ(100px)
+</style>

components/PostList.vue

@@ -10,9 +10,18 @@
           span {{ rwdate(item.updatedAt) }}
           div(v-html="markdown(item.data)")
       .options
-        i.fas.fa-eraser(v-if="account.gid === 1 || account.uid === item.uid")
-        i.fas.fa-marker(v-if="account.gid === 1 || account.uid === item.uid")
-        i.fas.fa-heart(:class="{ like: item.like }", @click="like(item._id)")
+        i.fas.fa-eraser(
+          v-if="account.gid === 1 || account.uid === item.uid",
+          @click="remove(item._id)"
+        )
+        i.fas.fa-marker(
+          v-if="account.gid === 1 || account.uid === item.uid",
+          @click="remove(item._id)"
+        )
+        i.fas.fa-heart(
+          :class="{ like: item.like }",
+          @click="like(item._id, item.like)"
+        )
   .post-none(v-else) 没有评论~
 </template>
 
@@ -87,9 +96,21 @@ export default {
     markdown(data) {
       return marked.parse(data);
     },
-    like(_id) {
+    like(_id, en) {
+      if (en) {
+        return this.$axios
+          .delete("/api/like?attach=post&aid=" + _id)
+          .then((res) => {
+            if (res.status === 200) {
+              this.data.forEach((item) => {
+                if (item._id === _id) {
+                  item.like = false;
+                }
+              });
+            }
+          });
+      }
       let data = { attach: "post", aid: _id };
-      console.log(data);
       this.$axios.post("/api/like", data).then((res) => {
         if (res.status === 200) {
           this.data.forEach((item) => {
@@ -100,6 +121,16 @@ export default {
         }
       });
     },
+    remove(_id) {
+      this.$axios.delete("/api/post/" + _id).then((res) => {
+        if (res.status === 200) {
+          this.$emit(
+            "update:data",
+            this.data.filter((item) => item._id !== _id)
+          );
+        }
+      });
+    },
   },
 };
 </script>