feat:增加美食朋友圈接口

src/components/Moment/MomentCard.vue

@@ -1,15 +1,15 @@
 <template>
   <div class="moment-card card-item">
-    <el-avatar src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" />
+    <el-avatar :src="serviceFileRootPath + props.item.avatar" fit="contain"/>
 
     <div class="moment-content">
-      <span class="username">Cxx0822</span>
-      <p>今天烧了个红烧鱼 非常不错！</p>
+      <span class="username">{{ props.item.username }}</span>
+      <p>{{ props.item.content }}</p>
 
       <el-image style="width: 200px; height: 200px"
                 src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" fit="fill" />
 
-      <p>1小时前</p>
+      <p>{{ props.item.date }}</p>
 
       <div class="button-container">
         <el-button circle size="small">
@@ -49,14 +49,10 @@
       </div>
 
       <div class="moment-comment-list">
-        <div class="moment-comment-item">
-          <span class="name">Cxx：</span>
-          <span>确实很不错</span>
-        </div>
-
-        <div class="moment-comment-item">
-          <span class="name">Cxx：</span>
-          <span>确实很不错阿</span>
+        <div v-for="(comment, index) in props.item.commentList" :key="index"
+             class="moment-comment-item">
+          <span class="name">{{ comment.username }}：</span>
+          <span>{{ comment.content }}</span>
         </div>
       </div>
     </div>
@@ -67,7 +63,16 @@
 import EmojiPicker from 'vue3-emoji-picker'
 import 'vue3-emoji-picker/css'
 import { Edit } from '@element-plus/icons-vue'
-import { reactive } from 'vue'
+import { defineProps, PropType, reactive } from 'vue'
+import { IMoment } from '@/types/food'
+import { serviceFileRootPath } from '@/utils'
+
+const props = defineProps({
+  item: {
+    required: true,
+    type: Object as PropType<IMoment>
+  }
+})
 
 const momentInfo = reactive({
   isShowComment: false,