zm/taimed
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tijiao

Browse Source
This commit is contained in:
始于初见
2025-08-11 17:47:51 +08:00
parent 54e657f53d
commit 285536c739
2 changed files with 256 additions and 254 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
pages/articleList/article.vue
View File

@@ -135,7 +135,6 @@
:nodes="articleInfo.content" :nodes="articleInfo.content"
style="height: auto; margin-bottom: 260rpx; color: #4b4b4b" style="height: auto; margin-bottom: 260rpx; color: #4b4b4b"
/> />
</view> </view>
<!-- 显示聊天记录 --> <!-- 显示聊天记录 -->
@@ -167,7 +166,11 @@
</view> </view>
<text style="letter-spacing: 4rpx">点赞</text> <text style="letter-spacing: 4rpx">点赞</text>
</view> </view>
<view class="footer_item" style="color: #9a9a9a" @click.stop="onHandleClickBuy"> <view
class="footer_item"
style="color: #9a9a9a"
@click.stop="onHandleClickOpenComment"
>
<view class="footer_item_icon" <view class="footer_item_icon"
><uni-icons ><uni-icons
type="chat-filled" type="chat-filled"
@@ -175,7 +178,7 @@
style="color: #9a9a9a" style="color: #9a9a9a"
></uni-icons> ></uni-icons>
<view class="footer_item_count" style="text-align: center">{{ <view class="footer_item_count" style="text-align: center">{{
articleInfo.likeCount ? articleInfo.likeCount : "0" articleInfo.commentCount ? articleInfo.commentCount : "0"
}}</view> }}</view>
</view> </view>
<text style="letter-spacing: 4rpx">评论</text> <text style="letter-spacing: 4rpx">评论</text>
@@ -195,9 +198,16 @@
</view> </view>
<!-- <z-navigation></z-navigation> --> <!-- <z-navigation></z-navigation> -->
<u-popup :show="orderModalShow" mode="bottom" :round="8"> <u-popup
:show="orderModalShow"
mode="bottom"
:round="8"
style="background-color: #fff"
>
<view class="orderModalShow popup_box"> <view class="orderModalShow popup_box">
<view style="text-align: center;">全部{{commentData.length?commentData.length:' 0'}} 条评论</view> <view style="text-align: center"
>全部 {{ articleInfo.commentCount }} 条评论</view
>
<u-icon <u-icon
name="close" name="close"
@@ -211,11 +221,11 @@
top: 20rpx; top: 20rpx;
" "
></u-icon> ></u-icon>
<hb-comment style="margin-top: 40rpx;height: 60vh" <hb-comment
style="margin-top: 40rpx; height: 60vh;overflow: auto;padding-bottom: 60rpx;"
:user="articleInfo.taihuTalent" :user="articleInfo.taihuTalent"
ref="hbComment" ref="hbComment"
@add="add" @add="sendComment"
@del="del" @del="del"
@like="like" @like="like"
@focusOn="focusOn" @focusOn="focusOn"
@@ -384,14 +394,11 @@ export default {
}, 800); }, 800);
}, },
methods: { methods: {
onHandleClickBuy() { onHandleClickOpenComment() {
console.log("111 at line 384:", 111);
console.log('111 at line 384:', 111)
this.orderModalShow = true; this.orderModalShow = true;
}, },
closeOrderModalShow() { closeOrderModalShow() {
this.orderModalShow = false; this.orderModalShow = false;
}, },
saveContens(content) { saveContens(content) {
@@ -526,29 +533,7 @@ export default {
console.log(this.selectedItems); console.log(this.selectedItems);
console.log(this.selectedId); console.log(this.selectedId);
}, },
//基因模糊查询列表
getGenes(name) {
this.$http
.request({
url: "taihumed/precisionMedicine/getPrecisionMedicineGenes",
method: "POST",
data: { name: name },
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
if (res.code == 0) {
if (res.genes && res.genes.length > 0) {
this.searchResults = res.genes;
this.searchResultStatus = true;
} else {
this.searchResults = "";
this.searchResultStatus = false;
}
}
});
},
//勾选 //勾选
toggleCheck() { toggleCheck() {
this.isChecked = !this.isChecked; this.isChecked = !this.isChecked;
@@ -686,7 +671,6 @@ export default {
return; return;
} }
//创建对话 获取sessionId //创建对话 获取sessionId
this.createChat();
}, },
//创建新对话 //创建新对话
createChat() { createChat() {
@@ -711,15 +695,15 @@ export default {
}); });
}, },
//创建新对话 //创建新对话
createComment() { sendComment(comment,pid) {
this.$http this.$http
.request({ .request({
url: "common/taihuTalentArticle/addArticleComment", url: "common/taihuTalentArticle/addArticleComment",
method: "POST", method: "POST",
data: { data: {
"pid":"", //第一条评论为0 pid: pid?pid:0, //第一条评论为0
"articleId":"", //文章id articleId: this.options.id, //文章id
"content":"" //内容 content: comment, //内容
}, },
header: { header: {
"Content-Type": "application/json", "Content-Type": "application/json",
@@ -728,7 +712,8 @@ export default {
.then((res) => { .then((res) => {
console.log("res at line 713:", res); console.log("res at line 713:", res);
if (res.code == 0) { if (res.code == 0) {
} else {
this.$commonJS.showToast("评论失败");
} }
}); });
}, },
@@ -737,10 +722,10 @@ export default {
getTree(data) { getTree(data) {
let result = []; let result = [];
let map = {}; let map = {};
data.forEach(item => { data.forEach((item) => {
map[item.id] = item; map[item.id] = item;
}); });
data.forEach(item => { data.forEach((item) => {
let parent = map[item.parentId]; let parent = map[item.parentId];
if (parent) { if (parent) {
(parent.children || (parent.children = [])).push(item); (parent.children || (parent.children = [])).push(item);
@@ -771,15 +756,11 @@ export default {
this.articleInfo = res.article; this.articleInfo = res.article;
this.commentData = res.comments; this.commentData = res.comments;
res={
"readNumer": 193,
"commentList": []
}
this.commentData = { this.commentData = {
"readNumer": res.readNumer,
"commentSize": res.commentList.length, commentSize: res.commentCount,
"comment": this.getTree(res.commentList) comment: this.getTree(this.commentData),
} };
this.$forceUpdate(); this.$forceUpdate();
// 滚动到最底部锚点 // 滚动到最底部锚点
@@ -1360,7 +1341,8 @@ h3 {
font-size: 24rpx; font-size: 24rpx;
line-height: 28rpx; line-height: 28rpx;
} }
} .orderModalShow { }
.orderModalShow {
width: 100%; width: 100%;
// max-height: 48vh; // max-height: 48vh;
// padding-bottom: 120rpx; // padding-bottom: 120rpx;

284
uni_modules/hb-comment/components/hb-comment/hb-comment.vue
View File

@@ -13,21 +13,21 @@
<!-- 评论主体-start --> <!-- 评论主体-start -->
<view class="comment-list" v-if="commentData.comment.length != 0"> <view class="comment-list" v-if="commentData.comment.length != 0">
<!-- 评论主体-顶部数量及发表评论按钮-start --> <!-- 评论主体-顶部数量及发表评论按钮-start -->
<view class="comment-num"> <!-- <view class="comment-num">
<view>共 {{ commentData.commentSize }} 条评论</view> <view>共 {{ commentData.commentSize }} 条评论</view>
<view class="add-btn"> <view class="add-btn">
<button type="primary" size="mini" @click="commentInput"> <button type="primary" size="mini" @click="commentInput">
发表评论 发表评论
</button> </button>
</view> </view>
</view> </view> -->
<!-- 评论主体-顶部数量及发表评论按钮-end --> <!-- 评论主体-顶部数量及发表评论按钮-end -->
<!-- 评论列表-start --> <!-- 评论列表-start -->
<view class="comment-box" v-for="(item, index) in commentData.comment"> <view class="comment-box" v-for="(item, index) in commentData.comment">
<view class="comment-box-item"> <view class="comment-box-item">
<view> <view>
<image <image
:src="item.avatarUrl || emptyAvatar" :src="item.user.avatar || emptyAvatar"
mode="aspectFill" mode="aspectFill"
class="avatar" class="avatar"
></image> ></image>
@@ -36,56 +36,46 @@
<!-- 父评论体-start --> <!-- 父评论体-start -->
<view class="comment-main-top"> <view class="comment-main-top">
<view class="nick-name-box"> <view class="nick-name-box">
<view class="comLogo com1" v-if="index == 0">沙发</view> <view class="nick-name" style="font-size: 32rpx">{{
<view class="comLogo com2" v-if="index == 1">板凳</view> item.user.nickname ? item.user.nickname : "普通用户"
<view class="comLogo com3" v-if="index == 2">地板</view> }}</view>
<view class="comLogo com4" v-if="index > 2" </view>
>{{ index + 1 }}楼</view </view>
<view
class="comment-main-content"
style="color: #555459; line-height: 38rpx"
@click="reply(item.user.nickname, item.user.nickname, item.id)"
> >
<view class="nick-name">{{ item.nickName }}</view> {{ item.content }}
</view> <!-- {{
<view class="zan-box" @click="like(item.id)">
<span :class="item.hasLike ? 'isLike' : 'notLike'">{{
item.likeNum == 0 ? "抢首赞" : item.likeNum
}}</span>
<img
style="width: 14px; height: 14px"
v-if="!item.hasLike"
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAApVJREFUWEfFlz9oFEEUxr93SWEhFkIaBUljo4WgATEaiI0GwVLBQg2EzLd3hSBqLI2lRgWLY+ftSSQgggoWNv5pImLUwjQBg1goqCCIIBqwueSeTLg7Ln9Mcmdub7vdnZnvN9+8fe+toMWXtFgfDQGMjo52zM7OHgMwIyLTg4ODk41upG4A7/0OEbkPYGdFVEQuOOeuNQJRN4CqBvGw+3dm9kZEBsrCPSRf1gvRCIAFETPrjqLodZIkY2Z2SkQmnHMHUgMgOQ8fx3FvJpMZB/CDZEfqACEgi8XidwA/SW5uKkCN2AzJTYscmCTZ1VQA7/2AiNwSkefOuYNBLEmSnJnlATwgebypAKr6CMBRANdJng9i3vu8iORE5Mrc3NyTlQDM7HMul/tYO2bNX0GhUDhRKpXumtlvAPuiKJouOzBuZr117HyBU6sCqOpeAH0AhssiwyQvVwTjOO5va2s7vRaAGtCrJC+GOVUAVb1UTjDVDLd4URHJOuf8WsSWG5MkSbeZTYR3lc+4CpAkyUpWht3fI/m+UfEwL5/Pb2xvb59ZFkBV5zNchazsSBBeYPn/ABQKhZ5SqfQCwBTJXYuPoOkAqnoGwE0Ad0ieTB3Ae39bRPoBDJEcSR1AVd8C2CMifc65p6kCmJkkSfIHwAYAW0h+SxVAVXcDmDSzL1EUbasEc20eaGoQVuoIgMckj6QOoKo3AJwFMEJyqBUAIegOAegnOdYKgK8AtmYyma7aLjqVGPDebxeRDwB+AeggWUzVAVV1ABTAK5L7l+0HVPUTgM7Q7VQGhPJZe99oHagpw4dJPvsXQPixONeoyErzRGTKzB7W9hFLjiA8iOO4M7iw3hDZbLbq6pIeY73F6l1v1Zas3gXrHf8XhhNvMGSmtPYAAAAASUVORK5CYII="
/>
<img
style="width: 14px; height: 14px"
v-else
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAfVJREFUWEfFl79LHEEUx7/vclr4g51TLFQQW9FNDFhFBDvjtcF0gXSp5eYuWJlUAW9NIP9BIFUEOxFtTKF2FrezKFgkkEBS3h4SAtHbJ6vu5W5d1F3cm20WZt+b7+e9mTfzlqD5Ic36SATw+OPJQP2ft+ABJwQ+VFIcJA0kEYBpVfcAehKIMqHoFISVBCI2wOS76mi9g76HxTLwZiqybzcuRGwAc7WWB/NGWIhBu440ZlIHmFitLRPzm+tC9EtJY1gjAP9VMtelEQC2kuJR6gCm5X4BsBAWImDdluJZqgBjH/4MZr3TYzB6IoRWmHnzJgDK0g+1KL4128SqgnD9x432yn5NSfE88L0VYPx9rS/jYR6EJTCPJxQNu60oKV77gw2Ai/Ly1/ZKRElx8c20XL4n0ZZpgvkbAKbl7gCYDax0ALREmjJAo2SbM9A+AKLPqmC8aNkD4bVOMwPEKNlFUdYGkAE9rUhjSxvA2YOOoaPF7t+6AH4qKUauHURt3AObSoq8NgAGyo4UJW0ABH5py9wnbQAAppq76HYfRLXOXmPg4BWdasoA7yuZm47sB0zL9Vvt0TQvI/bqc06pfzsS4KHlWgwUUgKwmWjdKRhvI1q5/0P+T8dZ9jILTjH31X9PlKuNKzppXxDMFeV/a0eUVPSuftoBzgHKR/ohZwAugwAAAABJRU5ErkJggg=="
/>
</view>
</view>
<view class="comment-main-content">
{{
item.content.length > 60 item.content.length > 60
? item.content.slice(0, 59) ? item.content.slice(0, 59)
: item.content : item.content
}} }} -->
<span v-if="item.content.length > 60"> <!-- <span v-if="item.content.length > 60">
{{ item.hasShowMore ? item.content.slice(59) : "..." }} {{ item.hasShowMore ? item.content.slice(59) : "..." }}
<span class="foot-btn" @click="showMore(item.id)"> <span class="foot-btn" @click="showMore(item.id)" style="color: #5188e5 !important;">
{{ item.hasShowMore ? "收起" : "展开" }} {{ item.hasShowMore ? "收起" : "展开" }}
</span> </span>
</span> </span> -->
</view> </view>
<view class="comment-main-foot"> <view class="comment-main-foot">
<view class="foot-time">{{ item.createTime }}</view>
<view <view
class="foot-btn" class="foot-time"
@click="reply(item.nickName, item.nickName, item.id)" style="color: #555459; letter-spacing: 1rpx; font-size: 24rpx"
>回复</view >{{ item.createTime }}</view
> >
<view <view
class="foot-btn"
@click="reply(item.user.nickname, item.user.nickname, item.id)"
>回复</view
>
<!-- <view
class="foot-btn" class="foot-btn"
v-if="item.owner" v-if="item.owner"
@click="confirmDelete(item.id)" @click="confirmDelete(item.id)"
>删除</view >删除</view
> > -->
</view> </view>
<!-- 父评论体-end --> <!-- 父评论体-end -->
<!-- 子评论列表-start --> <!-- 子评论列表-start -->
@@ -93,7 +83,7 @@
<view class="comment-sub-item" v-for="each in item.children"> <view class="comment-sub-item" v-for="each in item.children">
<view> <view>
<image <image
:src="each.avatarUrl || emptyAvatar" :src="each.user.avatar || emptyAvatar"
mode="aspectFill" mode="aspectFill"
class="avatar" class="avatar"
> >
@@ -101,50 +91,46 @@
</view> </view>
<view class="comment-main"> <view class="comment-main">
<view class="sub-comment-main-top"> <view class="sub-comment-main-top">
<view class="nick-name">{{ each.nickName }}</view> <view
<view class="zan-box" @click="like(each.id)"> class="nick-name"
<span :class="each.hasLike ? 'isLike' : 'notLike'">{{ style="font-size: 32rpx"
each.likeNum == 0 ? "抢首赞" : each.likeNum v-if="each.user"
}}</span> >{{
<img each.user.nickname ? each.user.nickname : "普通用户"
style="width: 14px; height: 14px" }}</view
v-if="!each.hasLike" >
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAApVJREFUWEfFlz9oFEEUxr93SWEhFkIaBUljo4WgATEaiI0GwVLBQg2EzLd3hSBqLI2lRgWLY+ftSSQgggoWNv5pImLUwjQBg1goqCCIIBqwueSeTLg7Ln9Mcmdub7vdnZnvN9+8fe+toMWXtFgfDQGMjo52zM7OHgMwIyLTg4ODk41upG4A7/0OEbkPYGdFVEQuOOeuNQJRN4CqBvGw+3dm9kZEBsrCPSRf1gvRCIAFETPrjqLodZIkY2Z2SkQmnHMHUgMgOQ8fx3FvJpMZB/CDZEfqACEgi8XidwA/SW5uKkCN2AzJTYscmCTZ1VQA7/2AiNwSkefOuYNBLEmSnJnlATwgebypAKr6CMBRANdJng9i3vu8iORE5Mrc3NyTlQDM7HMul/tYO2bNX0GhUDhRKpXumtlvAPuiKJouOzBuZr117HyBU6sCqOpeAH0AhssiwyQvVwTjOO5va2s7vRaAGtCrJC+GOVUAVb1UTjDVDLd4URHJOuf8WsSWG5MkSbeZTYR3lc+4CpAkyUpWht3fI/m+UfEwL5/Pb2xvb59ZFkBV5zNchazsSBBeYPn/ABQKhZ5SqfQCwBTJXYuPoOkAqnoGwE0Ad0ieTB3Ae39bRPoBDJEcSR1AVd8C2CMifc65p6kCmJkkSfIHwAYAW0h+SxVAVXcDmDSzL1EUbasEc20eaGoQVuoIgMckj6QOoKo3AJwFMEJyqBUAIegOAegnOdYKgK8AtmYyma7aLjqVGPDebxeRDwB+AeggWUzVAVV1ABTAK5L7l+0HVPUTgM7Q7VQGhPJZe99oHagpw4dJPvsXQPixONeoyErzRGTKzB7W9hFLjiA8iOO4M7iw3hDZbLbq6pIeY73F6l1v1Zas3gXrHf8XhhNvMGSmtPYAAAAASUVORK5CYII="
/>
<img
style="width: 14px; height: 14px"
v-else
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAfVJREFUWEfFl79LHEEUx7/vclr4g51TLFQQW9FNDFhFBDvjtcF0gXSp5eYuWJlUAW9NIP9BIFUEOxFtTKF2FrezKFgkkEBS3h4SAtHbJ6vu5W5d1F3cm20WZt+b7+e9mTfzlqD5Ic36SATw+OPJQP2ft+ABJwQ+VFIcJA0kEYBpVfcAehKIMqHoFISVBCI2wOS76mi9g76HxTLwZiqybzcuRGwAc7WWB/NGWIhBu440ZlIHmFitLRPzm+tC9EtJY1gjAP9VMtelEQC2kuJR6gCm5X4BsBAWImDdluJZqgBjH/4MZr3TYzB6IoRWmHnzJgDK0g+1KL4128SqgnD9x432yn5NSfE88L0VYPx9rS/jYR6EJTCPJxQNu60oKV77gw2Ai/Ly1/ZKRElx8c20XL4n0ZZpgvkbAKbl7gCYDax0ALREmjJAo2SbM9A+AKLPqmC8aNkD4bVOMwPEKNlFUdYGkAE9rUhjSxvA2YOOoaPF7t+6AH4qKUauHURt3AObSoq8NgAGyo4UJW0ABH5py9wnbQAAppq76HYfRLXOXmPg4BWdasoA7yuZm47sB0zL9Vvt0TQvI/bqc06pfzsS4KHlWgwUUgKwmWjdKRhvI1q5/0P+T8dZ9jILTjH31X9PlKuNKzppXxDMFeV/a0eUVPSuftoBzgHKR/ohZwAugwAAAABJRU5ErkJggg=="
/>
</view> </view>
</view> <view
<view class="comment-main-content"> class="comment-main-content"
{{ style="color: #555459 !important; line-height: 38rpx"
each.content.length > 60 >
? each.content.slice(0, 59) {{ each.content }}
: each.content
}}
<span v-if="each.content.length > 60">
{{ each.hasShowMore ? each.content.slice(59) : "..." }}
<span class="foot-btn" @click="showMore(each.id)">
{{ each.hasShowMore ? "收起" : "展开" }}
</span>
</span>
</view> </view>
<view class="comment-main-foot"> <view class="comment-main-foot">
<view class="foot-time">{{ each.createTime }}</view> <view
class="foot-time"
style="
color: #555459;
letter-spacing: 1rpx;
font-size: 24rpx;
"
>{{ each.createTime }}</view
>
<view <view
class="foot-btn" class="foot-btn"
@click="reply(item.nickName, each.nickName, item.id)" v-if="each.user"
@click="
reply(each.user.nickname, each.user.nickname, item.id)
"
> >
回复</view 回复</view
> >
<view <!-- <view
class="foot-btn" class="foot-btn"
v-if="each.owner" v-if="each.owner"
@click="confirmDelete(each.id)" @click="confirmDelete(each.id)"
>删除 >删除
</view> </view> -->
</view> </view>
</view> </view>
</view> </view>
@@ -157,53 +143,69 @@
</view> </view>
<!-- 评论主体-end --> <!-- 评论主体-end -->
<!-- 无评论-start --> <!-- 无评论-start -->
<view class="comment-none" v-else> <view class="comment-none">
<image <image
:src="user.icon ? user.icon : '/static/images/avatar.png'" :src="user.icon ? user.icon : '/static/images/avatar.png'"
style=" style="
width: 80rpx; width: 70rpx;
height: 80rpx; height: 70rpx;
margin: 0 10rpx; margin: 0 8rpx;
display: block; display: block;
border-radius: 80rpx; border-radius: 70rpx;
" "
/> />
<button
class="comment-btn" <!-- background-color: #dadada59; -->
<view
style="
width: calc(100% - 100rpx);
margin-right: 20rpx;
position: relative;
padding: 20rpx 20rpx;
border-radius: 10rpx;
"
>
<view v-if="currentInputComment" style="position: absolute; top: 10rpx"
><text @click="currentInputComment = ''">清空</text
><text @click="sendComment">发送</text></view
>
<view
style="font-size: 30rpx; width: calc(100%)"
@click="showInput = true" @click="showInput = true"
v-if="!showInput" v-if="!showInput"
>写评论...</view
> >
写评论 </view>
</button>
<!-- background-color: #dadada59; -->
<!-- <view style="width: calc(100% - 120rpx);margin-right: 20rpx;position: relative;padding:20rpx 20rpx;border-radius: 10rpx;">
<view v-if="currentInputComment" style="position: absolute;top: 10rpx;"><text @click="currentInputComment=''">清空</text><text @click="sendComment">发送</text></view>
<textarea style="font-size: 26rpx;width: calc(100%);color: #333;"
v-model="currentInputComment"
auto-height
clear
maxlength="-1"
placeholder="写评论..."
placeholder-class=""
/>
</view> -->
<view <view
class="input-container" class="input-container"
:style="{ bottom: keyboardHeight + 'px' }" :style="{ bottom: keyboardHeight + 'px' }"
v-if="showInput" v-if="showInput"
> >
<input <view style="overflow: hidden; margin-bottom: 12rpx"
><text
@click="
showInput = false;
commentContent = '';
"
style="float: left"
>取消</text
><text @click="sendComment" style="float: right; color: #1985fd"
>发送</text
></view
>
<view>
<textarea
auto-height
style="max-height: 200rpx; overflow-y: auto; padding: 20rpx"
v-model="commentContent" v-model="commentContent"
class="comment-input" class="comment-input"
placeholder="请输入评论..." maxlength="-1"
:placeholder="placeholder ? placeholder : '写评论...'"
@focus="onInputFocus" @focus="onInputFocus"
@blur="onInputBlur" @blur="onInputBlur"
:auto-focus="showInput" :auto-focus="showInput"
/> />
<button class="send-btn" @click="sendComment">发送</button> </view>
</view> </view>
<!-- 暂无评论，<span @click="commentInput" style="color: #007AFF;">立即评论</span> --> <!-- 暂无评论，<span @click="commentInput" style="color: #007AFF;">立即评论</span> -->
@@ -247,7 +249,7 @@ v-model="currentInputComment"
</template> </template>
<script> <script>
import text from 'uview-ui/libs/config/props/text'; import text from "uview-ui/libs/config/props/text";
export default { export default {
name: "hb-comment", name: "hb-comment",
@@ -281,18 +283,18 @@ export default {
}, },
data() { data() {
return { return {
pId: 0,
showInput: false, // 是否显示输入框 showInput: false, // 是否显示输入框
commentContent: '', // 评论内容 commentContent: "", // 评论内容
keyboardHeight: 0, // 软键盘高度 keyboardHeight: 0, // 软键盘高度
keyboardListener: null, // 软键盘监听事件 keyboardListener: null, // 软键盘监听事件
currentInputComment:'', currentInputComment: "",
emptyAvatar: emptyAvatar:
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABF5JREFUWEfFl11oHFUUx//nbmKwxdJ9qFL7YPEhRJC2gljjF60WG0WsoNkWfSnZ7Jy7FVPF0AoKpmBFqyIG3Jk7G1iIQXHbBz+KbbGtRfBbMe2LseKjiVDoiqIhwZ0jV3fb3cnM7kQCuU+7M+ec/+9+nHPPEJZ50DLrY1EApVJp9fz8/BYRuZ2INgDYWJvAWRE5R0RnZmZmPh4ZGZlPOrFEAMVi8e4gCPYSUZ+IXGGFgiCYIaJpKyQi1yql1orIFgAXARxRSvm5XO67diBtAYwxRQCDAE4RUUkpdWxwcNCKLBiu665TSj0kIpqIbgTgMzO3gmgJYIz5CMB9AIaZ+bXGQMVi8RoRuZeI/lZKHc1ms3/U34+Pj6+cnZ3dC+AggGPMfH8cRCyAMUZqThlmPlwPUCgU0qlUyq7Kww1BrbjHzPsahYwx/QDK9hkzR2pFPjTGnAWwIexkjOkRkRIR3Rozo5Miskdr/VMIxE7mHDPXD+2l1wsA6nseBMHmfD7/dSjQOwB2tTlYC/bddd1blFJfARhj5lyjfxNA7bSfitpz3/d3iYgFaDuUUjeHM8AY8zSAV5VS9+RyudP1IE0Axpj3Aaxk5m1hFc/zPiWiO9uq/2dwiJn3h22NMScB/MnMOxYAjI6Orurq6rpgU0hrXYpw/hFAd0KAD5n5wbCt7/t7ROT1ubm5NUNDQ7/b95dWwHXd7Uqp452dnVcPDAxciACwDlclAbAFynGcdRGr2EtEnwdB0JfP5080ARhjDhLRbY7jbI0SMcZUAKxOAgDgN2ZOx8SxGfEiMz/bBOD7/lgQBCu01o/GOH4PYFNCgElmvinK1vf9X2xxchzHVtfLW2CMOQpgipmHYwBeBtBUaOJgRKSgtX48Js63AH5l5geaADzPe1cpddFxnHyM42YAXyZYAXt+epn557iVFJHzWuudYYDnlFJ9juPcESfi+35JRHa3gdjPzIfibIwxNtPe0Fq/EAZ4hIhcZl4T5+y67nql1CcA1kfZENFnrSZQ6ycqItKvtT4SBthIRJMdHR092WzW5nzk8H1/WEReiQHY4TjOB3G+nuf9qyEim7TW9r65fAjL5fKVlUrlPICXmPnNFquwWym1oFBZ+yAItubz+TMtAJ4gon3pdLo7k8nMNgHYP7ZeE5EWkbuYeaYx0NjY2HXValUDeApAV4zIJIADzPxe+H2hULg+lUp9U6sBl3qLprugXC6nKpXKF0R02nGcZ2wQ3/e3ichOEckQ0aoEWQDbsgF4a3p6eqLeH3qeN0FE3el0ujeTyVTrcaKuY1uIjIg8CaCfiLYnEW1hY4WPi8gEgMeY+e1G27iGxHYxtptZynGYmTPhgK1asqWEiBRfcAjDdMaYpYCIFW8LUMuM54nIsb3/YvbDXskiYtuzA6382n4X1CDWAnCSgNSFa98ETakcWbwWMytjzAoAPUEQ3JBKpXrs75r/VLVanVJK/VC7Uf9KGjfRCiQN9n/slh3gHz9i4jC+FVL5AAAAAElFTkSuQmCC", "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABF5JREFUWEfFl11oHFUUx//nbmKwxdJ9qFL7YPEhRJC2gljjF60WG0WsoNkWfSnZ7Jy7FVPF0AoKpmBFqyIG3Jk7G1iIQXHbBz+KbbGtRfBbMe2LseKjiVDoiqIhwZ0jV3fb3cnM7kQCuU+7M+ec/+9+nHPPEJZ50DLrY1EApVJp9fz8/BYRuZ2INgDYWJvAWRE5R0RnZmZmPh4ZGZlPOrFEAMVi8e4gCPYSUZ+IXGGFgiCYIaJpKyQi1yql1orIFgAXARxRSvm5XO67diBtAYwxRQCDAE4RUUkpdWxwcNCKLBiu665TSj0kIpqIbgTgMzO3gmgJYIz5CMB9AIaZ+bXGQMVi8RoRuZeI/lZKHc1ms3/U34+Pj6+cnZ3dC+AggGPMfH8cRCyAMUZqThlmPlwPUCgU0qlUyq7Kww1BrbjHzPsahYwx/QDK9hkzR2pFPjTGnAWwIexkjOkRkRIR3Rozo5Miskdr/VMIxE7mHDPXD+2l1wsA6nseBMHmfD7/dSjQOwB2tTlYC/bddd1blFJfARhj5lyjfxNA7bSfitpz3/d3iYgFaDuUUjeHM8AY8zSAV5VS9+RyudP1IE0Axpj3Aaxk5m1hFc/zPiWiO9uq/2dwiJn3h22NMScB/MnMOxYAjI6Orurq6rpgU0hrXYpw/hFAd0KAD5n5wbCt7/t7ROT1ubm5NUNDQ7/b95dWwHXd7Uqp452dnVcPDAxciACwDlclAbAFynGcdRGr2EtEnwdB0JfP5080ARhjDhLRbY7jbI0SMcZUAKxOAgDgN2ZOx8SxGfEiMz/bBOD7/lgQBCu01o/GOH4PYFNCgElmvinK1vf9X2xxchzHVtfLW2CMOQpgipmHYwBeBtBUaOJgRKSgtX48Js63AH5l5geaADzPe1cpddFxnHyM42YAXyZYAXt+epn557iVFJHzWuudYYDnlFJ9juPcESfi+35JRHa3gdjPzIfibIwxNtPe0Fq/EAZ4hIhcZl4T5+y67nql1CcA1kfZENFnrSZQ6ycqItKvtT4SBthIRJMdHR092WzW5nzk8H1/WEReiQHY4TjOB3G+nuf9qyEim7TW9r65fAjL5fKVlUrlPICXmPnNFquwWym1oFBZ+yAItubz+TMtAJ4gon3pdLo7k8nMNgHYP7ZeE5EWkbuYeaYx0NjY2HXValUDeApAV4zIJIADzPxe+H2hULg+lUp9U6sBl3qLprugXC6nKpXKF0R02nGcZ2wQ3/e3ichOEckQ0aoEWQDbsgF4a3p6eqLeH3qeN0FE3el0ujeTyVTrcaKuY1uIjIg8CaCfiLYnEW1hY4WPi8gEgMeY+e1G27iGxHYxtptZynGYmTPhgK1asqWEiBRfcAjDdMaYpYCIFW8LUMuM54nIsb3/YvbDXskiYtuzA6382n4X1CDWAnCSgNSFa98ETakcWbwWMytjzAoAPUEQ3JBKpXrs75r/VLVanVJK/VC7Uf9KGjfRCiQN9n/slh3gHz9i4jC+FVL5AAAAAElFTkSuQmCC",
commentData: null, commentData: null,
placeholder: "请输入评论", placeholder: "",
commentReq: { commentReq: {
pId: null, // 评论父id pId: null, // 评论父id
content: null, // 评论内容
}, },
pUser: null, // 标签-回复人 pUser: null, // 标签-回复人
showTag: false, // 标签展示与否 showTag: false, // 标签展示与否
@@ -302,7 +304,12 @@ export default {
}; };
}, },
mounted: function () { mounted: function () {
this.keyboardListener = uni.onKeyboardHeightChange(res => { this.pId = 0;
this.showInput = false;
this.placeholder = "写评论...";
this.commentContent = "";
this.keyboardListener = uni.onKeyboardHeightChange((res) => {
this.keyboardHeight = res.height; this.keyboardHeight = res.height;
}); });
uni.onKeyboardHeightChange((res) => { uni.onKeyboardHeightChange((res) => {
@@ -332,10 +339,11 @@ export default {
sendComment() { sendComment() {
if (this.commentContent.trim()) { if (this.commentContent.trim()) {
// 这里添加发送评论的逻辑 // 这里添加发送评论的逻辑
console.log('发送评论:', this.commentContent); console.log("发送评论:", this.commentContent);
this.$emit("add", this.commentContent, this.pId);
// 发送成功后清空并隐藏输入框 // 发送成功后清空并隐藏输入框
this.commentContent = ''; this.commentContent = "";
this.showInput = false; this.showInput = false;
} }
}, },
@@ -355,13 +363,17 @@ export default {
reply(pUser, reUser, pId) { reply(pUser, reUser, pId) {
this.pUser = pUser; this.pUser = pUser;
this.commentReq.pId = pId; this.commentReq.pId = pId;
if (reUser) { this.pId = pId;
this.commentReq.content = "@" + reUser + " "; this.placeholder = "回复 " + pUser + ":";
} else {
this.commentReq.content = ""; // if (reUser) {
} // this.commentReq.content = "@" + reUser + " ";
this.showTag = true; // } else {
this.commentInput(); // this.commentReq.content = "";
// }
this.showInput = true;
// this.showTag = true;
// this.commentInput();
}, },
// 删除评论前确认 // 删除评论前确认
confirmDelete(commentId) { confirmDelete(commentId) {
@@ -377,20 +389,20 @@ export default {
}, },
}); });
}, },
// 新增评论 // // 新增评论
add() { // add() {
if ( // if (
this.commentReq.content == null || // this.commentReq.content == null ||
this.commentReq.content.length < 2 // this.commentReq.content.length < 2
) { // ) {
uni.showToast({ // uni.showToast({
title: "评论内容过短", // title: "评论内容过短",
duration: 2000, // duration: 2000,
}); // });
return; // return;
} // }
this.$emit("add", this.commentReq); // this.$emit("add", this.commentReq);
}, // },
// 点赞评论 // 点赞评论
like(commentId) { like(commentId) {
this.$emit("like", commentId); this.$emit("like", commentId);
@@ -587,6 +599,8 @@ export default {
.nick-name { .nick-name {
color: #2d8cf0; color: #2d8cf0;
color: #262626;
font-size: 40rpx;
} }
.isLike { .isLike {
@@ -602,7 +616,8 @@ export default {
} }
.comment-main-content { .comment-main-content {
padding: 10rpx 10rpx 10rpx 0; padding: 8rpx 10rpx 8rpx 0;
// font-size: 30rpx;
} }
.comment-main-foot { .comment-main-foot {
@@ -630,7 +645,7 @@ export default {
} }
.foot-btn { .foot-btn {
padding-left: 10rpx; padding-left: 20rpx;
color: #007aff; color: #007aff;
} }
@@ -643,7 +658,7 @@ export default {
} }
.comment-none { .comment-none {
padding: 20rpx 0; padding: 16rpx 0;
width: 100%; width: 100%;
// text-align: center; // text-align: center;
color: #999999; color: #999999;
@@ -653,6 +668,10 @@ export default {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
justify-content: space-between; justify-content: space-between;
border-top: 1rpx solid #e1e1e1;
font-size: 32rpx !important;
background-color: #fff;
} }
.comment-submit-box { .comment-submit-box {
@@ -716,7 +735,7 @@ export default {
position: fixed; position: fixed;
left: 0; left: 0;
width: 100%; width: 100%;
display: flex; // display: flex;
padding: 10px; padding: 10px;
background-color: #fff; background-color: #fff;
border-top: 1px solid #eee; border-top: 1px solid #eee;
@@ -725,11 +744,12 @@ export default {
} }
.comment-input { .comment-input {
flex: 1; width: 100%;
// flex: 1;
height: 40px; height: 40px;
padding: 0 15px; padding: 0 15px;
background-color: #f5f5f5; background-color: #f5f5f5;
border-radius: 20px; border-radius: 20rpx;
font-size: 14px; font-size: 14px;
} }