feat:更新朋友圈功能

src/components/Moment/MomentCard.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="moment-card card-item">
-    <el-avatar :src="serviceFileRootPath + props.item.avatar" fit="contain"/>
+    <el-avatar :src="avatarUrl" fit="contain" @click="viewProfileClick"/>
 
     <div class="moment-content">
       <span class="username">{{ props.item.username }}</span>
@@ -9,7 +9,7 @@
       <div class="moment-image-list">
         <el-image v-for="(item, index) in props.item.imageList" :key="index"
                   :src="serviceFileRootPath + item" fit="cover"
-                  :preview-src-list="[serviceFileRootPath + item]"/>
+                  :preview-src-list=previewList />
       </div>
 
       <p>{{ formatTimeAgo(props.item.date) }}</p>
@@ -67,17 +67,19 @@
 import EmojiPicker from 'vue3-emoji-picker'
 import 'vue3-emoji-picker/css'
 import { Edit } from '@element-plus/icons-vue'
-import { defineProps, reactive } from 'vue'
+import { computed, defineProps, reactive } from 'vue'
 import type { PropType } from 'vue'
 import type { IMoment } from '@/types/food'
-import { fileServiceUrl, serviceFileRootPath } from '@/utils'
+import { serviceFileRootPath } from '@/utils'
 import { formatTimeAgo } from '@/utils/dateUtils'
 import { useFoodStore } from '@/store/food'
 import { useUserStore } from '@/store/user'
+import { useAppStore } from '@/store/app'
 import { useRouter } from 'vue-router'
 
 const router = useRouter()
 const userStore = useUserStore()
+const appStore = useAppStore()
 
 const props = defineProps({
   item: {
@@ -93,10 +95,22 @@ const momentInfo = reactive({
   comment: ''
 })
 
+const avatarUrl = computed(() => {
+  if (props.item?.avatar) {
+    return serviceFileRootPath + props.item.avatar
+  } else {
+    return 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
+  }
+})
+
+const previewList = computed(() => {
+  return props.item?.imageList.map((item) => serviceFileRootPath + item)
+})
+
 const editClick = () => {
   foodStore.momentApiType = 'UPDATE'
   foodStore.currentMoment = props.item as IMoment
-  router.push('/moment/momentForm')
+  router.push('/moment/form')
 }
 
 const onSelectEmoji = (emoji) => {
@@ -109,6 +123,15 @@ const sendCommentClick = async () => {
   momentInfo.comment = ''
   momentInfo.isShowComment = false
 }
+
+const viewProfileClick = async () => {
+  if (props.item?.userId !== userStore.userInfo.id) {
+    appStore.isShowMobileBack = true
+    foodStore.currentMomentUserId = props.item?.userId as number
+    await userStore.queryUser(foodStore.currentMomentUserId)
+    await router.push('/moment/profile')
+  }
+}
 </script>
 
 <style lang="scss">