A1300399510/PC-vote
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 修复评论图片样式及更新API调用方式

Browse Source 
调整评论图片的样式，添加滚动和间距
将多个API调用从Http.post更新为Http.postV2
修复DetailsArea组件中的变量名错误
启用ismyself状态检查
This commit is contained in:
A1300399510
2025-11-12 01:01:54 +08:00
parent 68000d7e43
commit ac9a2debf2
7 changed files with 254 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
assets/css/DetailsComments.css
View File

@@ -439,8 +439,12 @@
color: #92a1bf;
display: inline;
}
.comment-list .comment-item .comment-content .comments-img-box {
overflow: auto;
}
.comment-list .comment-item .comment-content .comments-img {
width: 75px;
height: 100px;
margin-right: 10px;
margin-bottom: 13px;
border-radius: 5px;
}

7
assets/css/DetailsComments.less
View File

@@ -551,8 +551,13 @@
}
}
.comments-img-box {
overflow: auto;
}
.comments-img {
width: 75px;
height: 100px;
margin-right: 10px;
margin-bottom: 13px;
border-radius: 5px;
}

6
components/DetailsArea.vue
View File

@@ -27,9 +27,9 @@
</div>
<div class="item flexacenter" style="cursor: auto">
<img class="icon" src="@/assets/img/discuss-icon.png" />
<div>{{ commentTotalCount || "讨论" }}</div>
<div>{{ commentComments || "讨论" }}</div>
</div>
<div class="item flexacenter" style="cursor: auto" @click="openBi()">
<div class="item flexacenter" @click="openBi()">
<img class="icon" src="@/assets/img/bi-black-icon.png" />
<div>{{ topicInfo.coins || "投币" }}</div>
</div>
@@ -87,7 +87,7 @@
</div>
<Like v-if="isLikeGif"></Like>
<bi-card :coins="topicInfo.coins" :token="topicToken"></bi-card>
<bi-card :coins="topicInfo.coins" :token="topicToken" pagetpye="vote"></bi-card>
</template>
<script setup>

347
components/DetailsComments.vue
View File

@@ -6,12 +6,15 @@
<div class="text">编辑评论</div>
<div class="input-box">
<div class="top flexflex">
<textarea ref="editInputRef" class="input-textarea flex1" maxlength="500" v-model="editInput" @focus="judgeLogin" @input="autoResize" @paste="handleInputPaste" placeholder="说说你的想法或疑问…"></textarea>
<textarea ref="editInputRef" class="input-textarea flex1" maxlength="500" v-model="editInput"
@focus="judgeLogin" @input="autoResize" @paste="handleInputPaste"
placeholder="说说你的想法或疑问…"></textarea>
</div>
<div class="picture-box flexacenter" v-if="editPicture.length != 0">
<div class="picture" v-for="(item, index) in editPicture" :key="item.url">
<img class="close" @click="closeEditFileUpload(item.aid)" src="@/assets/img/close-icon.png" />
<div class="picture" v-for="item in editPicture" :key="item.url">
<img class="close" @click="closeEditFileUpload(item.aid)"
src="@/assets/img/close-icon.png" />
<img class="img" @click="handleAnswerText" :src="item.url" />
</div>
</div>
@@ -19,20 +22,23 @@
<div class="bottom flexacenter">
<div class="operate flexacenter">
<div class="item" :class="{ pitch: editEmojiState }" style="z-index: 2">
<el-popover placement="left-start" popper-class="emoji-popover" :width="584" trigger="click" v-model:visible="editEmojiState" :teleported="false">
<el-popover placement="left-start" popper-class="emoji-popover" :width="584"
trigger="click" v-model:visible="editEmojiState" :teleported="false">
<template #reference>
<img class="icon" src="@/assets/img/smiling-face.png" alt="" />
</template>
<div class="emoji-box">
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEditEmoji(item)">{{ item }}</div>
<div class="emoji-icon" v-for="item in emojiData" :key="item"
@click="selectEditEmoji(item)">{{ item }}</div>
</div>
</el-popover>
</div>
<div class="item flexacenter" @click="judgeLogin()">
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
<input class="file" type="file" @change="handleFileUpload($event)"
accept=".png, .jpg, .jpeg" />
<img class="icon" style="border-radius: 0" src="@/assets/img/picture-icon.png" alt="" />
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
<span class="file-hint">最多可上传{{ maxPicture }}张图片，支持在输入框中直接粘贴图片。</span>
</div>
</div>
</div>
@@ -46,7 +52,7 @@
<div class="comment-title flexacenter">
讨论
<span class="comment-amount">{{ commentComments || "" }}</span>
<span class="comment-amount">{{ commentComments || 0 }}</span>
</div>
<!-- <div class="post-comment" ref="postInputRef" :class="{ 'post-comment-focus': postCommentFocusState }" @click="loginJudgment()">
@@ -60,9 +66,10 @@
<div class="input-box">
<div class="top flexflex">
<img class="avatar" v-if="userInfoWin.avatar" :src="userInfoWin.avatar" />
<textarea class="input-textarea flex1" maxlength="500" v-model="commentInputTop" @focus="judgeLogin" @input="autoResize" @paste="handleInputPaste" placeholder="说说你的想法或疑问…"></textarea>
<textarea class="input-textarea flex1" maxlength="500" v-model="commentInputTop" @focus="judgeLogin"
@input="autoResize" @paste="handleInputPaste" placeholder="说说你的想法或疑问…"></textarea>
</div>
<div class="picture-box flexacenter" v-if="picture.length != 0">
<div class="picture-box flexacenter" v-if="picture.length != 0" style="width: 470px;">
<div class="picture" v-for="(item, index) in picture" :key="index">
<img class="close" @click="closePictureUpload(index)" src="@/assets/img/close-icon.png" />
<img class="img" @click="handleAnswerText" :src="item.url" />
@@ -71,43 +78,50 @@
<div class="bottom flexacenter">
<div class="operate flexacenter">
<div class="item" :class="{ pitch: emojiState }">
<el-popover placement="left" popper-class="emoji-popover" :width="625" trigger="click" v-model:visible="emojiState" :teleported="false">
<el-popover placement="left" popper-class="emoji-popover" :width="625" trigger="click"
v-model:visible="emojiState" :teleported="false">
<template #reference>
<img class="icon" src="@/assets/img/smiling-face.png" alt="" />
</template>
<div class="emoji-box">
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item)">{{ item }}</div>
<div class="emoji-icon" v-for="item in emojiData" :key="item"
@click="selectEmoji(item)">{{ item
}}</div>
</div>
</el-popover>
</div>
<div class="item flexacenter" @click="judgeLogin()">
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
<img class="icon" src="@/assets/img/picture-icon.png" alt="" />
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
<span class="file-hint">最多可上传{{ maxPicture }}张图片，支持在输入框中直接粘贴图片。</span>
</div>
</div>
<div class="btn" @click="submitAnswerComments(commentInputTop)">发送</div>
</div>
</div>
<div class="empty-box" v-if="isEmptyState">
<div class="empty-box" v-if="commentComments == 0">
<Empty hint="说说你的观点吧"></Empty>
</div>
<template v-else>
<div class="comment-list">
<div class="comment-item flexflex" v-for="(item, index) in commentList" :key="item.id">
<el-popover placement="bottom-start" :width="140" trigger="click" popper-class="avatar-box-popper" :show-arrow="false" v-model:visible="item['popoverState']">
<el-popover placement="bottom-start" :width="140" trigger="click" popper-class="avatar-box-popper"
:show-arrow="false" v-model:visible="item['popoverState']">
<template #reference>
<img class="comment-avatar" :src="item.avatar || item.user['avatar']" />
</template>
<div class="avatar-box flexflex" v-if="item.uin || item.user['uin'] || item.uid || item.user['uid']">
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(item.uin || item.user['uin'], item.uid || item.user['uid'])">
<div class="avatar-box flexflex"
v-if="item.uin || item.user['uin'] || item.uid || item.user['uid']">
<a class="avatar-item flexcenter" target="_blank"
@click.prevent="sendMessage(item.uin || item.user['uin'], item.uid || item.user['uid'])">
<img class="avatar-icon" src="@/assets/img/send-messages-icon.png" />
发送信息
</a>
<a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(item.uin || item.user['uin'], item.uid || item.user['uid'])">
<a class="avatar-item flexcenter" target="_blank"
@click.prevent="TAHomePage(item.uin || item.user['uin'], item.uid || item.user['uid'])">
<img class="avatar-icon" src="@/assets/img/homepage-icon.png" />
TA的主页
</a>
@@ -116,63 +130,84 @@
<div class="comment-content flex1">
<div class="comment-header flexacenter">
<div class="comment-header-left flexacenter">
<div class="comments-username" @click="openAvatarPopover(index)">{{ item.nickname || item.user["nickname"] || "匿名用户" }}</div>
<div class="comments-username" @click="openAvatarPopover(index)">{{ item.nickname ||
item.user["nickname"]
|| "匿名用户" }}</div>
<div class="comments-time">{{ item["timestamp"] }}</div>
<div class="comments-identity" v-if="item['isauthor'] == 1">作者</div>
<img class="comments-title" v-if="item.groupimage || item?.user?.groupimage" :src="item.groupimage || item?.user?.groupimage" :alt="item?.user?.grouptitle" style="height: 18px" />
<img class="comments-title" v-if="item.groupimage || item?.user?.groupimage"
:src="item.groupimage || item?.user?.groupimage" :alt="item?.user?.grouptitle"
style="height: 18px" />
</div>
<div class="comment-header-right flexacenter">
<div class="menu-box flexacenter">
<img class="menu-icon" src="@/assets/img/menu-icon-gray.svg" />
<div class="operate-box">
<div class="item flexcenter" @click="report(item['token'])">举报</div>
<div class="item flexcenter" v-if="permissions.includes('comment.edit')" @click="openEdit(item['token'], index)">编辑</div>
<div class="item flexcenter" v-if="permissions.includes('comment.delete')" @click="commentDelete(item['token'], index)">删除</div>
<div class="item flexcenter" v-if="permissions.includes('comment.edit')"
@click="openEdit(item['token'], index)">编辑</div>
<div class="item flexcenter" v-if="permissions.includes('comment.delete')"
@click="commentDelete(item['token'], index)">删除</div>
</div>
</div>
<img class="comment-icon" title="回复" @click="!item['childState'] ? openAnswerCommentsChild(index) : closeAnswerCommentsChild()" src="@/assets/img/comment-icon-gray.svg" />
<img class="comment-icon" title="回复"
@click="!item['childState'] ? openAnswerCommentsChild(index) : closeAnswerCommentsChild()"
src="@/assets/img/comment-icon-gray.svg" />
<div class="flexacenter like-box" @click="commentLike(index)">
<img class="like-icon" v-if="item['islike'] == 1" src="@/assets/img/like-red-pitch.png" />
<img class="like-icon" v-if="item['islike'] == 1"
src="@/assets/img/like-red-pitch.png" />
<img class="like-icon" v-else src="@/assets/img/like-icon-gray.png" />
<div class="like-quantity">{{ item["likenum"] || 0 }}</div>
</div>
</div>
</div>
<div class="comment-text" v-if="item['content']" @click="!item['childState'] ? openAnswerCommentsChild(index) : closeAnswerCommentsChild()">{{ item["content"] }}</div>
<div class="comment-text" v-if="item['content']"
@click="!item['childState'] ? openAnswerCommentsChild(index) : closeAnswerCommentsChild()">
{{ item["content"] }}
</div>
<!-- <img class="comments-img" @click="handleAnswerText" :src="item.image?.base64 || item.image?.url" v-if="item.image?.url" /> -->
<div class="comments-img-box">
<img class="comments-img" v-for="(item, index) in item.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
<div class="comments-img-box flexacenter" v-if="item.attachments.images?.length != 0"
style="overflow: auto;width: 440px;">
<img class="comments-img" v-for="(item, index) in item.attachments.images" :key="index"
@click="handleAnswerText" :src="item.thumb || item.url" />
</div>
<div class="alreadyVoted" v-if="item.voteoption">已投：{{ item.voteoption }}</div>
<div class="input-box" v-if="item['childState']">
<img class="cross" @click="closeAnswerCommentsChild()" src="@/assets/img/cross-icon.png" />
<div class="top flexflex">
<textarea class="input-textarea flex1" maxlength="500" placeholder="说说你的想法或疑问…" v-model="item['commentInput']" @input="autoResize" @paste="handleInputPaste($event, index)"></textarea>
<textarea class="input-textarea flex1" maxlength="500" placeholder="说说你的想法或疑问…"
v-model="item['commentInput']" @input="autoResize"
@paste="handleInputPaste($event, index)"></textarea>
</div>
<div class="picture-box flexacenter" v-if="item?.picture?.length != 0" style="width: 440px;">
<div class="picture-box flexacenter" v-if="item?.picture?.length != 0"
style="width: 440px;">
<div class="picture" v-for="it in item.picture" :key="it.url">
<img class="close" @click="closeFileUpload(it.aid, index)" src="@/assets/img/close-icon.png" />
<img class="close" @click="closeFileUpload(it.aid, index)"
src="@/assets/img/close-icon.png" />
<img class="img" @click="handleAnswerText" :src="it.url" />
</div>
</div>
<div class="bottom flexacenter">
<div class="operate flexacenter">
<div class="item" :class="{ pitch: item.emojiState }">
<el-popover placement="left" popper-class="emoji-popover" :width="625" trigger="click" v-model:visible="item.emojiState" :teleported="false">
<el-popover placement="left" popper-class="emoji-popover" :width="625"
trigger="click" v-model:visible="item.emojiState" :teleported="false">
<template #reference>
<img class="icon" src="@/assets/img/smiling-face.png" alt="" />
</template>
<div class="emoji-box">
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index)">{{ item }}</div>
<div class="emoji-icon" v-for="item in emojiData" :key="item"
@click="selectEmoji(item, index)">{{ item }}</div>
</div>
</el-popover>
</div>
<div class="item flexacenter">
<input class="file" type="file" @change="handleFileUpload($event, index)" accept=".png, .jpg, .jpeg" />
<input class="file" type="file" @change="handleFileUpload($event, index)"
accept=".png, .jpg, .jpeg" />
<img class="icon" src="@/assets/img/picture-icon.png" alt="" />
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
<span class="file-hint">最多可上传{{ maxPicture }}张图片，支持在输入框中直接粘贴图片。</span>
</div>
</div>
<div class="btn" @click="submitAnswerComments(item['commentInput'], index)">发送</div>
@@ -182,17 +217,22 @@
<!-- 子评论 -->
<div class="child-comments" v-if="item['child'].length > 0">
<div class="comment-item flexflex" v-for="(ite, i) in item['child']" :key="ite.id">
<el-popover placement="bottom-start" :width="140" trigger="click" popper-class="avatar-box-popper" :show-arrow="false" v-model:visible="ite['popoverState']">
<el-popover placement="bottom-start" :width="140" trigger="click"
popper-class="avatar-box-popper" :show-arrow="false"
v-model:visible="ite['popoverState']">
<template #reference>
<img class="comment-avatar" :src="ite.avatar || ite.user['avatar']" />
</template>
<div class="avatar-box flexflex" v-if="ite.uin || ite.user['uin'] || ite.uid || ite.user['uid']">
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(ite.uin || ite.user['uin'], ite.uid || ite.user['uid'])">
<div class="avatar-box flexflex"
v-if="ite.uin || ite.user['uin'] || ite.uid || ite.user['uid']">
<a class="avatar-item flexcenter" target="_blank"
@click.prevent="sendMessage(ite.uin || ite.user['uin'], ite.uid || ite.user['uid'])">
<img class="avatar-icon" src="@/assets/img/send-messages-icon.png" />
发送信息
</a>
<a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(ite.uin || ite.user['uin'], ite.uid || ite.user['uid'])">
<a class="avatar-item flexcenter" target="_blank"
@click.prevent="TAHomePage(ite.uin || ite.user['uin'], ite.uid || ite.user['uid'])">
<img class="avatar-icon" src="@/assets/img/homepage-icon.png" />
TA的主页
</a>
@@ -201,46 +241,67 @@
<div class="comment-content flex1">
<div class="comment-header flexacenter">
<div class="comment-header-left flexacenter">
<div class="comments-username" @click="openAvatarPopover(index, i)">{{ ite.nickname || ite.user["nickname"] || "匿名用户" }}</div>
<div class="comments-username" @click="openAvatarPopover(index, i)">{{
ite.nickname ||
ite.user["nickname"] || "匿名用户" }}</div>
<div class="comments-time">{{ ite["timestamp"] }}</div>
<div class="comments-identity" v-if="ite['isauthor']">作者</div>
<img class="comments-title" v-if="ite.groupimage || ite.user?.groupimage" :src="ite.groupimage || ite.user?.groupimage" :alt="ite?.user?.grouptitle" style="height: 18px" />
<img class="comments-title" v-if="ite.groupimage || ite.user?.groupimage"
:src="ite.groupimage || ite.user?.groupimage"
:alt="ite?.user?.grouptitle" style="height: 18px" />
</div>
<div class="comment-header-right flexacenter">
<div class="menu-box flexacenter">
<img class="menu-icon" src="@/assets/img/menu-icon-gray.svg" />
<div class="operate-box">
<div class="item flexcenter" @click="report(ite['token'])">举报</div>
<div class="item flexcenter" v-if="permissions.includes('comment.edit')" @click="openEdit(ite['token'], index, i)">编辑</div>
<div class="item flexcenter" v-if="permissions.includes('comment.delete')" @click="commentDelete(ite['token'], index, i)">删除</div>
<div class="item flexcenter"
v-if="permissions.includes('comment.edit')"
@click="openEdit(ite['token'], index, i)">编辑</div>
<div class="item flexcenter"
v-if="permissions.includes('comment.delete')"
@click="commentDelete(ite['token'], index, i)">删除</div>
</div>
</div>
<img class="comment-icon" title="回复" @click="!ite['childState'] ? openAnswerCommentsChild(index, i) : closeAnswerCommentsChild()" src="@/assets/img/comment-icon-gray.svg" />
<img class="comment-icon" title="回复"
@click="!ite['childState'] ? openAnswerCommentsChild(index, i) : closeAnswerCommentsChild()"
src="@/assets/img/comment-icon-gray.svg" />
<div class="flexacenter like-box" @click="commentLike(index, i)">
<img class="like-icon" v-if="ite['islike'] == 1" src="@/assets/img/like-red-pitch.png" />
<img class="like-icon" v-if="ite['islike'] == 1"
src="@/assets/img/like-red-pitch.png" />
<img class="like-icon" v-else src="@/assets/img/like-icon-gray.png" />
<div class="like-quantity">{{ ite["likenum"] || 0 }}</div>
</div>
</div>
</div>
<div class="comment-text" v-if="ite['content']" @click="!ite['childState'] ? openAnswerCommentsChild(index, i) : closeAnswerCommentsChild()">
<div class="comments-reply" v-if="ite?.reply?.nickname">@{{ ite?.reply?.nickname }}</div>
<div class="comment-text" v-if="ite['content']"
@click="!ite['childState'] ? openAnswerCommentsChild(index, i) : closeAnswerCommentsChild()">
<div class="comments-reply" v-if="ite?.reply?.nickname">@{{ ite?.reply?.nickname
}}</div>
{{ ite["content"] }}
</div>
<!-- <img class="comments-img" @click="handleAnswerText" :src="ite.image?.base64 || ite.image?.url" v-if="ite.image?.url" /> -->
<div class="comments-img-box">
<img class="comments-img" v-for="(item, index) in ite.attachments.images" @click="handleAnswerText" :src="ite.thumb || ite.url" />
<div class="comments-img-box flexacenter" v-if="ite.attachments.images?.length != 0"
style="overflow: auto;width: 410px;">
<img class="comments-img" v-for="(item, index) in ite.attachments.images"
:key="index" @click="handleAnswerText" :src="item.thumb || item.url" />
</div>
<div class="alreadyVoted" v-if="ite.voteoption">已投：{{ ite.voteoption }}</div>
<div class="input-box" v-if="ite['childState']">
<img class="cross" @click="closeAnswerCommentsChild()" src="@/assets/img/cross-icon.png" />
<img class="cross" @click="closeAnswerCommentsChild()"
src="@/assets/img/cross-icon.png" />
<div class="top flexflex">
<textarea class="input-textarea flex1" maxlength="500" :placeholder="'回复“' + (ite['nickname'] || ite.user['nickname'] || '匿名用户') + '”：'" v-model="ite['commentInput']" @input="autoResize" @paste="handleInputPaste($event, index)"></textarea>
<textarea class="input-textarea flex1" maxlength="500"
:placeholder="'回复“' + (ite['nickname'] || ite.user['nickname'] || '匿名用户') + '”：'"
v-model="ite['commentInput']" @input="autoResize"
@paste="handleInputPaste($event, index)"></textarea>
</div>
<div class="picture-box flexacenter" v-if="ite.picture?.length != 0" style="width: 408px;">
<div class="picture-box flexacenter" v-if="ite.picture?.length != 0"
style="width: 408px;">
<div class="picture" v-for="it in ite.picture" :key="it.url">
<img class="close" @click="closeFileUpload(it.aid, index, i)" src="@/assets/img/close-icon.png" />
<img class="close" @click="closeFileUpload(it.aid, index, i)"
src="@/assets/img/close-icon.png" />
<img class="img" @click="handleAnswerText" :src="it.url" />
</div>
</div>
@@ -248,23 +309,32 @@
<div class="bottom flexacenter">
<div class="operate flexacenter">
<div class="item" :class="{ pitch: ite.emojiState }">
<el-popover placement="left" popper-class="emoji-popover" :width="625" trigger="click" v-model:visible="ite.emojiState" :teleported="false">
<el-popover placement="left" popper-class="emoji-popover"
:width="625" trigger="click" v-model:visible="ite.emojiState"
:teleported="false">
<template #reference>
<img class="icon" src="@/assets/img/smiling-face.png" alt="" />
<img class="icon" src="@/assets/img/smiling-face.png"
alt="" />
</template>
<div class="emoji-box">
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index, i)">{{ item }}</div>
<div class="emoji-icon" v-for="item in emojiData"
:key="item" @click="selectEmoji(item, index, i)">{{ item
}}</div>
</div>
</el-popover>
</div>
<div class="item flexacenter">
<input class="file" type="file" @change="handleFileUpload($event, index, i)" accept=".png, .jpg, .jpeg" />
<input class="file" type="file"
@change="handleFileUpload($event, index, i)"
accept=".png, .jpg, .jpeg" />
<img class="icon" src="@/assets/img/picture-icon.png" alt="" />
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
<span class="file-hint">最多可上传{{ maxPicture
}}张图片，支持在输入框中直接粘贴图片。</span>
</div>
</div>
<div class="btn" @click="submitAnswerComments(ite['commentInput'], index, i)">发送</div>
<div class="btn"
@click="submitAnswerComments(ite['commentInput'], index, i)">发送</div>
</div>
</div>
<!-- <div class="comments-input-masking" @click="closeAnswerCommentsChild()" v-if="ite['childState']"></div>
@@ -281,7 +351,8 @@
</div>
</div>
<!-- 还有几个 -->
<div class="comments-also flexacenter" v-if="item['childnum'] > item['child'].length" @click="alsoCommentsData(index)">
<div class="comments-also flexacenter" v-if="item['childnum'] > item['child'].length"
@click="alsoCommentsData(index)">
<div class="">还有{{ item["childnum"] - item["child"].length }}条回复</div>
<img class="also-icon" src="@/assets/img/arrow-circular-gray.png" />
</div>
@@ -295,12 +366,14 @@
<Report v-if="reportAlertShow" :reportToken="reportToken"></Report>
<!-- 投票后自动评论 -->
<el-dialog class="default-popup automatic-reviews-popup" v-model="reviewsPopoverState" width="720px" align-center autosize :close-on-click-modal="false">
<el-dialog class="default-popup automatic-reviews-popup" v-model="reviewsPopoverState" width="720px" align-center
autosize :close-on-click-modal="false">
<div class="automatic-header">
<div class="automatic-title">说说您的投票理由</div>
<div class="automatic-have">已投：{{ haveVotedValue }}</div>
</div>
<el-input class="automatic-input" placeholder="请输入…" v-model="reviewsPopoverInput" type="textarea" maxlength="500" show-word-limit></el-input>
<el-input class="automatic-input" placeholder="请输入…" v-model="reviewsPopoverInput" type="textarea"
maxlength="500" show-word-limit></el-input>
<div class="automatic-bottom flexflex">
<div class="automatic-send flexcenter" @click="submitAnswerComments(reviewsPopoverInput)">发送</div>
</div>
@@ -344,7 +417,38 @@ watch(
{ immediate: false }
);
onMounted(() => window.addEventListener("scroll", handleScroll));
onMounted(() => {
window.addEventListener("scroll", handleScroll)
checkWConfig();
});
const checkWConfig = () => {
const wConfig = JSON.parse(localStorage.getItem("wConfig")) || {};
if (wConfig.time) {
const time = new Date(wConfig.time);
const now = new Date();
if (now - time > 24 * 60 * 60 * 1000) getWConfig();
else {
const config = wConfig.config || {};
maxPicture.value = config.topic_image_count;
}
} else {
getWConfig();
}
};
const getWConfig = () => {
getWConfigHttp().then((res) => {
if (res.code != 200) return
let data = res["data"] || {};
const config = data.config || {};
maxPicture.value = config.topic_image_count;
data.time = new Date().toISOString();
localStorage.setItem("wConfig", JSON.stringify(data));
});
};
let permissions = inject("permissions");
@@ -378,6 +482,7 @@ const getCommentList = () => {
let data = res.data;
data.data.forEach((element, index) => {
element.timestamp = strtimeago(element.created_at, 4);
element["picture"] = [];
@@ -398,9 +503,10 @@ const getCommentList = () => {
commentList.value = commentList.value.concat(data["data"]);
commentComments.value = data["comments"];
commentComments.value = data["commentcount"];
emit("update:commentComments", data["comments"]);
emit("update:commentComments", data["commentcount"]);
if (commentList.value.length == data["count"]) commentPage.value = 0;
else commentPage.value++;
@@ -494,7 +600,6 @@ const realname = inject("realname");
// 提交回答-评论
const submitAnswerComments = (content = "", index, i) => {
console.log("submitAnswerComments", submitAnswerComments);
if (realname.value == 0 && userInfoWin.value.uin > 0) {
openAttest();
@@ -545,9 +650,7 @@ const submitAnswerComments = (content = "", index, i) => {
let data = res.data;
const timestamp = strtimeago(new Date());
if (i != null) {
// console.log("targetCommentList[index]", targetCommentList[index])
targetCommentList[index]["child"][i]["commentInput"] = "";
targetCommentList[index]["child"][i]["picture"] = {};
@@ -587,10 +690,12 @@ const submitAnswerComments = (content = "", index, i) => {
attachments,
uin: userInfoWin.value.uin,
uid: userInfoWin.value.uid,
picture: [],
childnum: 0,
};
if (index != null) {
targetCommentList[index]["commentInput"] = "";
targetCommentList[index]["picture"] = {};
targetCommentList[index]["picture"] = [];
targetCommentList[index]["child"].unshift(targetData);
targetCommentList[index]["childnum"]++;
} else {
@@ -599,7 +704,11 @@ const submitAnswerComments = (content = "", index, i) => {
}
}
commentComments.value++;
commentComments.value = data.count || 0;
emit("update:commentComments", data.count || 0);
commentList.value = targetCommentList;
// 请求 输入框的数据
@@ -629,14 +738,13 @@ const alsoCommentsData = (index, ind) => {
return;
}
let targetCommentItem = { ...commentList.value[index] };
const token = targetCommentItem["token"];
const parentid = targetCommentItem["id"];
let page = targetCommentItem["childPage"] ?? 1;
detailsChildCommentListHttp({
childlimit: 3,
limit: 10,
page,
limit: 2000,
page: 1,
parentid,
token: props.token,
}).then((res) => {
@@ -648,26 +756,10 @@ const alsoCommentsData = (index, ind) => {
element["isReplyBoxShow"] = 0;
element["picture"] = [];
})
// let childData = targetCommentItem.child.concat(data.data);
// const filteredData = childData.filter((obj, index, self) => {
// // 检查当前对象在数组中的第一个索引是否与当前索引相等
// return self.findIndex((item) => item.id == obj.id) == index;
// });
// targetCommentItem.child = filteredData;
// targetCommentItem["childnum"] = data.count;
// if (targetCommentItem.child.length == data["count"]) page = 0;
// else page++;
// targetCommentItem["childPage"] = page;
let merged = [...commentList.value[index]["child"], ...data.data.filter((item2) => !commentList.value[index]["child"].find((item1) => item1.id == item2.id))];
commentList.value[index]["child"] = merged;
// commentList.value[index] = targetCommentItem;
});
};
@@ -843,21 +935,36 @@ const handleInputPaste = (event, index, ii) => {
return;
}
let target = [];
if (editCommentState.value) target = editPicture.value;
else {
if (ii != undefined) target = commentList.value[index].child[ii]["picture"];
else if (index != undefined) target = commentList.value[index]["picture"];
else target = picture.value;
}
if (target.length >= maxPicture.value) {
creationAlertBox("error", `最多只能上传 ${maxPicture.value} 张图片`);
return;
}
const reader = new FileReader();
reader.onload = (e) => {
const base64 = e.target.result;
uploadImg(file).then((res) => {
const obj = {
base64,
...res,
aid: res.aid || "",
url: res.url || "",
};
if (editCommentState.value) editPicture.value = obj;
target.push(obj);
if (editCommentState.value) editPicture.value = target;
else {
if (ii != undefined) commentList.value[index].child[ii]["picture"] = obj;
else if (index != undefined) commentList.value[index]["picture"] = obj;
else picture.value = obj;
if (ii != undefined) commentList.value[index].child[ii]["picture"] = target;
else if (index != undefined) commentList.value[index]["picture"] = target;
else picture.value = target;
}
ElMessage.success("上传成功");
@@ -884,6 +991,8 @@ const handleFileUpload = (event, index, i) => {
return;
}
let target = [];
if (editCommentState.value) target = editPicture.value;
else {
@@ -892,7 +1001,7 @@ const handleFileUpload = (event, index, i) => {
else target = picture.value;
}
console.log("target", target);
console.log(target.length, maxPicture.value);
if (target.length >= maxPicture.value) {
creationAlertBox("error", `最多只能上传 ${maxPicture.value} 张图片`);
@@ -1013,6 +1122,7 @@ const confirmCommentDelete = () => {
return;
}
if (commemtDelete.i >= 0) {
commentList.value[commemtDelete.index].child.splice(commemtDelete.i, 1);
commentList.value[commemtDelete.index].childnum -= 1;
@@ -1022,6 +1132,9 @@ const confirmCommentDelete = () => {
}
commentComments.value -= 1;
emit("update:commentComments", commentComments.value);
dialogVisible.value = false;
ElMessage.success(res.message || "操作成功");
@@ -1034,7 +1147,7 @@ const judgeLogin = () => {
let editCommentState = ref(false);
let editToken = "";
let editPicture = ref({});
let editPicture = ref([]);
let editInput = ref("");
let editEmojiState = ref(false);
const editInputRef = ref(null);
@@ -1044,21 +1157,18 @@ const openEdit = (token, index, i) => {
let target = {};
if (i != null) target = list[index]["child"][i];
else target = list[index];
// console.log(token, index, i, target)
editToken = target.token || "";
editInput.value = target.content || "";
editPicture.value = target.image || {};
editPicture.value = target.attachments?.images || [];
editCommentState.value = true;
nextTick(() => {
// console.log("editInput.value", editInputRef.value)
editInputRef.value.style.height = `${editInputRef.value.scrollHeight}px`;
});
};
const closeEdit = () => {
editPicture.value = {};
editPicture.value = []
editToken = "";
editInput.value = "";
editCommentState.value = false;
@@ -1085,11 +1195,13 @@ const postEditComment = () => {
}
const image = editPicture.value;
const attachments = {
images: image,
};
commentsEditSubmit({
content: editInput.value,
token: editToken,
image: image ? { aid: image.aid, url: image.url } : null,
attachments,
}).then((res) => {
if (res.code != 200) {
ElMessage.error(res.message);
@@ -1099,18 +1211,18 @@ const postEditComment = () => {
commentList.value.forEach((element) => {
if (element.token == editToken) {
element["content"] = editInput.value;
element["image"] = image;
element["attachments"] = attachments;
}
element.child &&
element.child.forEach((ele) => {
if (ele.token == editToken) {
ele["content"] = editInput.value;
ele["image"] = image;
ele["attachments"] = attachments;
}
});
});
editPicture.value = {};
editPicture.value = []
editToken = "";
editCommentState.value = false;
editEmojiState.value = false;
@@ -1118,28 +1230,7 @@ const postEditComment = () => {
});
};
const closeEditFileUpload = () => (editPicture.value = {});
// 同时监听多个值
// watch(
// // 监听的目标：变量和数组（使用计算属性返回需要判断的结果）
// () => {
// // 收集数组中所有父对象的emojiState
// const parentStates = commentList.value.map((item) => item.emojiState);
// const childStates = commentList.value.flatMap((item) => item.child.map((child) => child.emojiState));
// return [editEmojiState.value, emojiState.value, ...parentStates, ...childStates];
// },
// // 回调函数：当监听的目标变化时执行
// (allStates) => {
// console.log("allStates", allStates);
// // 使用some()判断是否有至少一个true
// const hasTrue = allStates.some((state) => state === true);
// console.log("hasTrue", hasTrue);
// emit("hasTrue", hasTrue); // 实时传递当前状态（true/false）
// },
// // 配置项：立即执行一次（可选）
// { immediate: true }
// );
const closeEditFileUpload = () => (editPicture.value = []);
defineExpose({ changeCommentVoteoption, wipeCommentVoteoption, reviewsComment, bottomNavigationBar, closeAnswerCommentsChild });
</script>

28
composables/api.js
View File

@@ -18,13 +18,13 @@ export const commentListHttp = (params) => {
// 评论相关 - 评论点赞
export const detailsLikeCommentHttp = (query) => {
// return Http.post("/api/comment/like", query);
return Http.post("https://api.gter.net/v2/api/forum/likeComment", query);
return Http.postV2("https://api.gter.net/v2/api/forum/likeComment", query);
};
// 详情数据 - 获取子评论数据
export const detailsChildCommentListHttp = (query) => {
// return Http.post("/api/comment/childrenList", query);
return Http.post("https://api.gter.net/v2/api/forum/childrenList", query);
return Http.postV2("https://api.gter.net/v2/api/forum/childrenList", query);
};
// 详情数据 - 提交评论
@@ -35,7 +35,8 @@ export const detailsSubmitommentListHttp = (query) => {
// 详情数据 - 提交评论
export const commentsEditSubmit = (query) => {
return Http.post("/api/comment/commentsEditSubmit", query);
// return Http.post("/api/comment/commentsEditSubmit", query);
return Http.postV2("https://api.gter.net/v2/api/forum/postCommentEdit", query);
};
// 发布相关 - 发布问题初始化,编辑
@@ -61,13 +62,13 @@ export const deleteHttp = (query) => {
// 操作-点赞
export const operateLikeHttp = (query) => {
// return Http.post("/api/operate/like", query);
return Http.post("https://api.gter.net/v2/api/forum/postTopicLike", query);
return Http.postV2("https://api.gter.net/v2/api/forum/postTopicLike", query);
};
// 数据操作 - 收藏
export const operateCollectHttp = (query) => {
// return Http.post("/api/operate/collect", query);
return Http.post("https://api.gter.net/v2/api/forum/postTopicCollect", query);
return Http.postV2("https://api.gter.net/v2/api/forum/postTopicCollect", query);
};
// 数据操作 - 投票操作
@@ -130,12 +131,13 @@ export const riposteDetailHttp = (query) => {
export const commonUploadHttp = (url, query) => Http.postV2(url, query);
export const commonUploadConfigHttp = (query) => {
return Http.post("https://api.gter.net/v1/config/upload?type=comment", query);
return Http.postV2("https://api.gter.net/v1/config/upload?type=comment", query);
};
// 评论相关 - 删除评论
export const commentDeleteHttp = (query) => {
return Http.post("/api/comment/commentDelete", query);
// return Http.post("/api/comment/commentDelete", query);
return Http.postV2("https://api.gter.net/v2/api/forum/deleteComment", query);
};
// 详情数据 - 投票详情
@@ -144,11 +146,11 @@ export const topicDetailHttp = (query) => {
};
export const topicRecommendHttp = (query) => {
return Http.post("https://api.gter.net/v2/api/forum/setTopicRecommend", query);
return Http.postV2("https://api.gter.net/v2/api/forum/setTopicRecommend", query);
};
export const topicEssenceHttp = (query) => {
return Http.post("https://api.gter.net/v2/api/forum/setTopicBest", query);
return Http.postV2("https://api.gter.net/v2/api/forum/setTopicBest", query);
};
export const topicDeleteHttp = (query) => {
@@ -156,9 +158,13 @@ export const topicDeleteHttp = (query) => {
};
export const topicHideHttp = (query) => {
return Http.post("https://api.gter.net/v2/api/forum/setTopicHide", query);
return Http.postV2("https://api.gter.net/v2/api/forum/setTopicHide", query);
};
export const topicgetOperationHttp = (query) => {
return Http.post("https://api.gter.net/v2/api/forum/getTopicOperation", query);
return Http.postV2("https://api.gter.net/v2/api/forum/getTopicOperation", query);
};
export const getWConfigHttp = (query) => {
return Http.get("https://api.gter.net/v2/api/config/website", query);
};

6
pages/details/[id].vue
View File

@@ -11,8 +11,8 @@
<div class="label flexflex" v-if="sectionn?.length || tags?.length || topicInfo.recommend == 1 || topicInfo.best == 1">
<img class="item icon" v-if="topicInfo.recommend == 1" src="@/assets/img/recommend-icon.png" />
<img class="item icon" v-if="topicInfo.best == 1" src="@/assets/img/essence-icon.png" />
<a class="item blue" v-for="(item, index) in sectionn" :key="item" :href="`https://f.gter.net/section/${item.uniqid}`" target="_blank">{{ item.name }}</a>
<a class="item" v-for="(item, index) in tags" :key="item" :href="`https://f.gter.net/tag/${item}?type=vote`" target="_blank">{{ item }}</a>
<a class="item blue" v-for="item in sectionn" :key="item" :href="`https://f.gter.net/section/${item.uniqid}`" target="_blank">{{ item.name }}</a>
<a class="item" v-for="item in tags" :key="item" :href="`https://f.gter.net/tag/${item}?type=vote`" target="_blank">{{ item }}</a>
</div>
<div class="flexacenter" style="position: relative;">
<div class="flex1">{{ info.title }}</div>
@@ -498,7 +498,7 @@ const getTopicDetail = (uniqid) => {
topicInfo.value = targetInfo;
// ismyself.value = data.ismyself;
ismyself.value = data.ismyself;
if (data.islogin) getTopicOperation();

2
utils/http.js
View File

@@ -11,7 +11,7 @@ axios.interceptors.request.use(
async (config) => {
// 开发时登录用的，可以直接替换小程序的 authorization
if (process.env.NODE_ENV !== "production") {
const miucms_session = "01346a38444d71aaadb3adad52b52c39";
const miucms_session = "3b01343c65e3b2fa3ce32ae26feb3a9b";
document.cookie = "miucms_session=" + miucms_session;
config["headers"]["authorization"] = miucms_session;
}