feat(dynamicManagement): 优化动态列表与详情页点赞逻辑及UI结构

- 引入 `likeDynamicList` 接口用于处理列表点赞操作，替换原有临时方案
- 修改用户头像获取逻辑，优先使用 `userImage` 字段
- 删除调试日志代码，清理冗余的头像字段判断
- 统一详情页和列表页点赞接口调用方式为表单提交形式
- 重构发布动态页面模板结构，提升可读性与维护性
- 优化上传组件、表单项及弹窗等 UI 结构，增强代码可读性

src/views/dynamicManagement/index.vue

@@ -372,7 +372,8 @@ import {
   getUserByPhone,
   toggleFollowUser,
   cancelFollowed,
-  likeDynamicNew
+  likeDynamicNew,
+  likeDynamicList
 } from "@/api/modules/dynamicManagement";
 import { uploadImg } from "@/api/modules/upload";
 import { useUserStore } from "@/stores/modules/user";
@@ -609,34 +610,8 @@ const loadDynamicList = async () => {
         const isVideo = firstUrl.toLowerCase().endsWith(".mp4");
         const mediaType = isVideo ? "video" : "image";
 
-        // 获取用户头像（尝试多种可能的字段名）
-        const userAvatar =
-          item.userAvatar ||
-          item.avatar ||
-          item.headImg ||
-          item.headImage ||
-          item.userHeadImg ||
-          item.avatarUrl ||
-          item.userImg ||
-          item.userPhoto ||
-          item.photo ||
-          item.profileImage ||
-          item.img ||
-          item.picUrl ||
-          "";
-
-        // 调试：输出接口返回的原始数据（仅第一条）
-        if (item.id === list[0]?.id) {
-          console.log("接口返回的原始数据字段:", Object.keys(item));
-          console.log("头像相关字段:", {
-            userAvatar: item.userAvatar,
-            avatar: item.avatar,
-            headImg: item.headImg,
-            headImage: item.headImage,
-            userHeadImg: item.userHeadImg,
-            最终使用: userAvatar
-          });
-        }
+        // 获取用户头像（优先使用 userImage 字段）
+        const userAvatar = item.userImage || item.userAvatar || item.avatar || item.headImg || "";
 
         return {
           id: item.id || item.dynamicId,
@@ -696,22 +671,26 @@ const handleCardClick = (item: DynamicItem) => {
   detailDrawerVisible.value = true;
 };
 
-// 点赞/取消点赞
+// 列表点赞/取消点赞
 const handleLike = async (item: DynamicItem) => {
   try {
-    // TODO: 集成真实接口时，取消下面的注释
-    // if (item.isLiked) {
-    //   await unlikeDynamic({ id: item.id });
-    // } else {
-    //   await likeDynamic({ id: item.id });
-    // }
-
-    // 临时方案：直接修改状态
+    // 获取当前用户的手机号，并在前面拼接 "store_"
+    const phone = userStore.userInfo?.phone || "";
+    const currentUserPhoneId = phone.startsWith("store_") ? phone : `store_${phone}`;
+
+    // 调用列表点赞接口（表单方式提交）
+    await likeDynamicList({
+      dynamicId: item.id,
+      phoneId: currentUserPhoneId
+    });
+
+    // 切换点赞状态
     item.isLiked = !item.isLiked;
     item.likeCount += item.isLiked ? 1 : -1;
 
     ElMessage.success(item.isLiked ? "点赞成功" : "取消点赞");
   } catch (error) {
+    console.error("列表点赞操作失败:", error);
     ElMessage.error("操作失败");
   }
 };
@@ -732,7 +711,7 @@ const handleCloseDetail = () => {
   }, 300);
 };
 
-// 详情页点赞
+// 详情页点赞（表单方式提交）
 const handleDetailLike = async () => {
   if (!currentDetail.value) return;
 
@@ -741,11 +720,10 @@ const handleDetailLike = async () => {
     const phone = userStore.userInfo?.phone || "";
     const currentUserPhoneId = phone.startsWith("store_") ? phone : `store_${phone}`;
 
-    // 调用点赞接口
+    // 调用详情点赞接口（表单方式提交）
     await likeDynamicNew({
-      userId: currentUserPhoneId,
-      huifuId: currentDetail.value.id, // ✅ 动态ID（不是phoneId）
-      // 当前用户phoneId (格式: store_xxx)
+      userId: currentUserPhoneId, // 当前用户phoneId
+      huifuId: currentDetail.value.id, // 动态ID
       type: 2 // 2表示点赞
     });