feat: 优化评论图片展示样式并添加用户交互功能

- 调整评论图片容器样式，支持横向滚动
- 为评论图片添加圆角和点击效果
- 实现用户主页跳转和私信功能
- 修复section变量名错误并优化初始化逻辑
- 添加评论点赞和子评论展开功能

js/details.js

@@ -92,8 +92,13 @@ const appSectionIndex = createApp({
 
         const init = () => {
             ajaxget(`/v2/api/forum/getTopicDetails?uniqid=${uniqid}`).then((res) => {
+                if (res.code != 200) {
+                    creationAlertBox("error", res.message || "主题不存在");
+                    return;
+                }
                 const data = res.data;
 
+                console.log(data, "data");
                 let targetInfo = data.info;
 
                 if (!targetInfo.hidden) targetInfo.hidden = 0;
@@ -335,7 +340,102 @@ const appSectionIndex = createApp({
 
         let picture = ref({});
 
-        return { permissions, commentList, commentPage, commentTotalCount, picture, userInfoWin, relatedList, relatedTime, coinNubmer, coinList, coinAmount, coinSubmit, strategy, mybalance, coinsState, openCoinBox, closeCoinBox, isLikeGif, likeClick, collectClick, islike, iscollect, recentlyList, medal, count, sectionn, tags, signInAlreadyState, authorInfo, info, timestamp, updatedTime };
+        const openUserInfo = (index, i) => {
+            if (i != undefined && commentList.value[index].child[i].user["uin"] > 0) commentList.value[index].child[i]["avatarState"] = true;
+            if (i == undefined && index != undefined && commentList.value[index].user["uin"] > 0) commentList.value[index]["avatarState"] = true;
+        };
+
+        const closeUserInfo = (index, i) => {
+            if (i != undefined) commentList.value[index].child[i]["avatarState"] = false;
+            else if (index != undefined) commentList.value[index]["avatarState"] = false;
+        };
+
+        // 打开 回答-评论 的子评论
+        const openAnswerCommentsChild = (index, i) => {
+            if (realname.value == 0 && userInfoWin.value?.uin > 0) {
+                openAttest();
+                return;
+            }
+
+            if (!isLogin.value) {
+                goLogin();
+                return;
+            }
+
+            closeAnswerCommentsChild();
+
+            if (i == null) commentList.value[index]["childState"] = true;
+            else commentList.value[index].child[i]["childState"] = true;
+        };
+
+        // 关闭 回答-评论 的子评论
+        const closeAnswerCommentsChild = () => {
+            commentList.value.forEach((ele) => {
+                ele["childState"] = false;
+                ele["commentInput"] = ""; // 删除原本输入值
+                if (ele["child"] && ele["child"].length != 0) {
+                    ele["child"].forEach((el) => {
+                        el["childState"] = false;
+                        el["commentInput"] = "";
+                    });
+                }
+            });
+        };
+
+        let dialogSrc = ref("");
+        const handleAnswerText = (e) => {
+            if (e.target.tagName === "IMG") {
+                var src = e.target.getAttribute("src");
+                dialogSrc.value = src;
+                window.addEventListener("keydown", handleKeydown);
+            }
+        };
+
+        const handleKeydown = (event) => {
+            if (event.key !== "Escape") return;
+            dialogSrc.value = "";
+            window.removeEventListener("keydown", handleKeydown); // 取消监听
+        };
+
+        // 回答-评论 点赞
+        const operateAnswerCommentsLike = (token, index, i) => {
+            if (realname.value == 0 && userInfoWin.value?.uin > 0) {
+                openAttest();
+                return;
+            }
+
+            if (!isLogin.value) {
+                goLogin();
+                return;
+            }
+
+            ajax("https://api.gter.net/v2/api/forum/likeComment", {
+                token,
+            }).then((res) => {
+                if (res.code != 200) {
+                    creationAlertBox("error", res.message || "操作成功");
+                    return;
+                }
+                let data = res.data;
+
+                if (i != undefined) {
+                    commentList.value[index].child[i]["islike"] = data["status"];
+                    commentList.value[index].child[i]["likenum"] = data["count"];
+                } else {
+                    commentList.value[index]["islike"] = data["status"];
+                    commentList.value[index]["likenum"] = data["count"];
+                }
+
+                creationAlertBox("success", res.message || "操作成功");
+
+                // if (status) this.$parent.openLikeGif();
+            });
+        };
+
+        const TAHomePage = (uin) => goHomePage(uin);
+        const sendMessage = (uin) => goSendMessage(uin);
+
+        return { closeAnswerCommentsChild, openAnswerCommentsChild, dialogSrc, handleAnswerText, sendMessage, TAHomePage, operateAnswerCommentsLike, closeUserInfo, openUserInfo, permissions, commentList, commentPage, commentTotalCount, picture, userInfoWin, relatedList, relatedTime, coinNubmer, coinList, coinAmount, coinSubmit, strategy, mybalance, coinsState, openCoinBox, closeCoinBox, isLikeGif, likeClick, collectClick, islike, iscollect, recentlyList, medal, count, sectionn, tags, signInAlreadyState, authorInfo, info, timestamp, updatedTime };
     },
 });