feat:更新朋友圈功能

src/components/Moment/MomentCard.vue

@@ -6,13 +6,16 @@
       <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" />
+      <div class="moment-image-list">
+        <el-image v-for="(item, index) in props.item.imageList" :key="index"
+                  :src="serviceFileRootPath + item" fit="fill" />
+      </div>
 
       <p>{{ formatTimeAgo(props.item.date) }}</p>
 
       <div class="button-container">
-        <el-button :icon="Edit" circle size="small" @click="editClick()"/>
+        <el-button v-if="props.item.userId === userStore.userInfo.id"
+                   :icon="Edit" circle size="small" @click="editClick()"/>
         <el-button circle size="small">
           <i class="fa-regular fa-thumbs-up"></i>
         </el-button>
@@ -66,12 +69,14 @@ import { Edit } from '@element-plus/icons-vue'
 import { defineProps, reactive } from 'vue'
 import type { PropType } from 'vue'
 import type { IMoment } from '@/types/food'
-import { serviceFileRootPath } from '@/utils'
+import { fileServiceUrl, serviceFileRootPath } from '@/utils'
 import { formatTimeAgo } from '@/utils/dateUtils'
 import { useFoodStore } from '@/store/food'
+import { useUserStore } from '@/store/user'
 import { useRouter } from 'vue-router'
 
 const router = useRouter()
+const userStore = useUserStore()
 
 const props = defineProps({
   item: {
@@ -127,6 +132,12 @@ const sendCommentClick = async () => {
       font-size: larger;
     }
 
+    .moment-image-list {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      gap: 10px;
+    }
+
     .moment-comment {
       display: grid;
       grid-template-columns: 1fr 40px 60px;