@@ -113,11 +113,11 @@
< view class = "tit_name" > { { item . nickname } } < / view >
< / view >
<!-- # ifdef MP - WEIXIN -- >
< image @click ="moreBtn(item)" :src = "`${config.aliyunOssUrl}/static/images/app/icon/more.png`"
< image @click ="moreBtn(item,2 )" :src = "`${config.aliyunOssUrl}/static/images/app/icon/more.png`"
style = "width: 32rpx;height: 32rpx;" > < / image >
<!-- # endif -- >
<!-- # ifdef APP -- >
< image @click ="moreBtn(item)" src = "@/static/images/app/icon/more.png"
< image @click ="moreBtn(item,2 )" src = "@/static/images/app/icon/more.png"
style = "width: 32rpx;height: 32rpx;" > < / image >
<!-- # endif -- >
< / view >
@@ -180,56 +180,78 @@
< / z-paging >
<!-- 底部输入框 -- >
< view class = "bottom_up" >
< view class = "bottom_l " >
< view @click.stop ="replyToComments(detailObj,1)" >
< u -textarea autoHeight fixed border = "none" :placeholder = "placeholder" maxlength = "100" :cursor-spacing = "20"
: customStyle = "'background-color: #f2f0f4;'" : disabled = 'true' / >
< view style = "display: flex;align-items: center;justify-content: space-between; " >
< view class = "bottom_l" :style = "{width:replyAddData.content?'540rpx':'326rpx'}" >
<!-- < view @click.stop ="replyToComments(detailObj,1)" >
< u -textarea autoHeight fixed :showConfirmBar = "false" border = "none" :placeholder = "placeholder" maxlength = "300"
:cursor-spacing = "20" :disabled = "true"
: customStyle = "{'background-color': '#f2f0f4','border-radius':'50rpx'}" / >
< / view > -- >
< textarea autoHeight fixed :showConfirmBar = "false" border = "none" :placeholder = "placeholder" maxlength = "300"
:cursor-spacing = "20" v-model = "replyAddData.content" @blur="textareaFlag = false" @focus="textareaFocusFn"
: style = "'background-color:#f2f0f4;border-radius: '+ 40 +'rpx;padding: 0 24rpx;hidth:72rpx'"
ref = "textarea" :autoFocus = "true"
@keyboardheightchange ="keyboardheightchangeFn" :focus = "focus" auto -blur / >
< / view >
<!-- < u-input placeholder = "请输入内容" border = "surround " v-model = "replyAddData.content" @change="change"
shape = 'circle' : customStyle = "'background-color: pink;'" @ focus = 'focus'
> < / u-input > -- >
< view class = "bottom_r " v-if = "! replyAddData.content" >
< view class = "r_img_txt" >
< image :src = "`${config.aliyunOssUrl}/static/images/app/icon/information1.png`" class = "imgSize4" > < / image >
< view class = "txt" > { { detailObj . replyNum || 0 } } < / view >
< / view >
< view class = "r_img_txt" @click ="collectBtn" >
< image v-if = "!detailObj.userIsCollect" :src="`${config.aliyunOssUrl}/static/images/app/icon/xingxing1.png`" class="imgSize4" / >
< image v-if = "detailObj.userIsCollect" :src="`${config.aliyunOssUrl}/static/images/app/icon/xingxing_end1.png`" class="imgSize4" > < / image >
< view class = "txt" > { { detailObj . collectNum || 0 } } < / view >
< / view >
< view class = "r_img_txt" @click ="likeDetailBtn" >
< image v-if = "!detailObj.userIsLike" :src="`${config.aliyunOssUrl}/static/images/app/icon/like_no1.png`" class="imgSize4" />
< image v-if = "detailObj.userIsLike" :src="`${config.aliyunOssUrl}/static/images/app/icon/like1.png`" class="imgSize4" > < / image >
< view class = "txt" > { { detailObj . likeNum || 0 } } < / view >
< / view >
<!-- < view class = "r_img_txt" style = "position:relative;" >
< image :src = "`${config.aliyunOssUrl}/static/images/app/icon/share.png`" class = "imgSize4" > < / image >
< view class = "txt" > { { detailObj . shareNum } } < / view >
< button id = "shareBtn" open -type = " share " @click ="shareBtnInfo(detailObj)" > < / button >
< / view > - - >
< / view >
< view v-else class = "bottom_send" >
< view @click.stop ="emojiShow = !emojiShow,openExpression()" >
< image src = "https://jimte.oss-cn-hangzhou.aliyuncs.com/xcximage/douyin/expression.png"
style = "width: 52rpx;height: 52rpx;" / >
< / view >
< view @click.stop ="sendSMS" >
< image
src = "https://smfwq2.oss-cn-shanghai.aliyuncs.com/2023/12/25/63571017a4a042b682e1c6be08a3cdda.png"
style = "width: 52rpx;height: 52rpx;" / >
< / view >
< / view >
< / view >
< view class = "bottom_r" >
< view class = "r_img_txt " >
<!-- # ifdef M P- WEIXIN -- >
< image :src = "`${config.aliyunOssUrl}/static/images/app/icon/information1.png`" class = "imgSize4" > < / image >
< template v-if = "emojiShow" >
< view style = "width: 690rpx; " >
<!-- # ifdef AP P- PLUS -- >
< waterfall column -count = " 8 " column -width = " auto " column -gap = " 0 " left -gap = " 10 "
style = "height: 400rpx;background-color: #fff;" >
< cell v-for = "(item,index) in emoicon" :key="index" style="padding: 10rpx;"
@click ="replyAddData.content += item" >
< text style = "font-size: 54rpx;" > { { item } } < / text >
< / cell >
< / waterfall >
<!-- # endif -- >
<!-- # ifdef APP -- >
< image src = "@/static/images/app/icon/information.png" class = "imgSize4" / >
<!-- # ifn def APP - PLUS -- >
< u-list height = "400rpx" customStyle = "background-color:#fff;padding:10rpx 0;" >
< u-grid col = "10" >
< u-grid-item v-for = "(item,index) in emoicon" :key="index" @click="replyAddData.content += item"
customStyle = "margin-bottom:20rpx;" >
< u-list-item >
< text style = "font-size: 54rpx;text-align: left;" > { { item } } < / text >
< / u-list-item >
< / u-grid-item >
< / u-grid >
< / u-list >
<!-- # endif -- >
< view class = "txt" > { { detailObj . replyNum || 0 } } < / view >
< / view >
< view class = "r_img_txt" @click ="collectBtn" >
< ! - - # ifdef APP - - >
<!-- transform : scale ( 1.5 ) -- >
< image v-if = "!detailObj.userIsCollect" src="@/static/images/app/icon/xingxing.png" class="imgSize4" > < / image >
< image v-if = "detailObj.userIsCollect" src="@/static/images/app/icon/xingxing_end.png" class="imgSize4" > < / image >
< ! - - # endif - - >
<!-- # ifdef MP - WEIXIN -- >
< image v-if = "!detailObj.userIsCollect" :src="`${config.aliyunOssUrl}/static/images/app/icon/xingxing1.png`" class="imgSize4" / >
< image v-if = "detailObj.userIsCollect" :src="`${config.aliyunOssUrl}/static/images/app/icon/xingxing_end1.png`" class="imgSize4" > < / image >
< ! - - # endif - - >
< view class = "txt" > { { detailObj . collectNum || 0 } } < / view >
< / view >
< view class = "r_img_txt" @click ="likeDetailBtn" >
< ! - - # ifdef APP - - >
< image v-if = "!detailObj.userIsLike" src="@/static/images/app/icon/like_no.png" class="imgSize4" > < / image >
< image v-if = "detailObj.userIsLike" src="@/static/images/app/icon/like.png" class="imgSize4" >
< / image >
< ! - - # endif - - >
<!-- # ifdef MP - WEIXIN -- >
< image v-if = "!detailObj.userIsLike" :src="`${config.aliyunOssUrl}/static/images/app/icon/like_no1.png`" class="imgSize4" />
< image v-if = "detailObj.userIsLike" :src="`${config.aliyunOssUrl}/static/images/app/icon/like1.png`" class="imgSize4" > < / image >
< ! - - # endif - - >
< view class = "txt" > { { detailObj . likeNum || 0 } } < / view >
< / view >
<!-- < view class = "r_img_txt" style = "position:relative;" >
< image :src = "`${config.aliyunOssUrl}/static/images/app/icon/share.png`" class = "imgSize4" > < / image >
< view class = "txt" > { { detailObj . shareNum } } < / view >
< button id = "shareBtn" open -type = " share " @click ="shareBtnInfo(detailObj)" > < / button >
< / view > - - >
< / view >
< / template >
< / view >
<!-- drop的弹层 -- >
@@ -321,25 +343,17 @@
< / u -popup >
<!-- 显示复制链接 , 已设置不喜欢 -- >
<!-- # ifdef MP - WEIXIN -- >
< view class = "img_view_weixin" >
<!-- < view class = "img_view_weixin" >
< image v-if = "imgShow1" :src="`${config.aliyunOssUrl}/static/images/app/config/link.png`" style="width: 260rpx;height: 76rpx; border-radius: 16rpx" > < / image >
< image v-if = "imgShow2" :src="`${config.aliyunOssUrl}/static/images/app/config/unlike.png`" style="width: 326rpx;height: 76rpx; border-radius: 16rpx" > < / image >
< / view >
< ! - - # endif - - >
<!-- # ifdef APP -- >
< view class = "img_view" >
< image v-if = "imgShow1" src="@/static/images/app/config/link.png" style="width: 260rpx;height: 76rpx; border-radius: 16rpx" > < / image >
< image v-if = "imgShow2" src="@/static/images/app/config/unlike.png" style="width: 326rpx;height: 76rpx; border-radius: 16rpx" > < / image >
< / view >
< ! - - # endif - - >
< / view > - - >
<!-- more 的弹层 -- >
< u-popup :show = "showMore" :round = "10" mode = "bottom" @close ="showMore=false" zIndex = '11000' >
< view class = "more_view" >
< view class = "txt" @click ="toReportPages" > 举报 < / view >
< view class = "txt" @click ="replyToComments(moreItem,2) " > 回复 < / view >
< view class = "txt" @click ="replyToCommentsCopy " > 回复 < / view >
< view class = "txt" @click ="cloneFn(moreItem)" > 复制 < / view >
< view class = "foot" @click ="showMore=false" > 取消 < / view >
< / view >
@@ -368,13 +382,13 @@
< view class = "con_title" >
< view class = "tit_name" > { { itemObj . nickname } } < / view >
<!-- # ifdef MP - WEIXIN -- >
< image @click ="moreBtn(itemObj)" :src = "`${config.aliyunOssUrl}/static/images/app/icon/more.png`" style = "width: 32rpx;height: 32rpx;" > < / image >
< image @click ="moreBtn(itemObj,3 )" :src = "`${config.aliyunOssUrl}/static/images/app/icon/more.png`" style = "width: 32rpx;height: 32rpx;" > < / image >
<!-- # endif -- >
<!-- # ifdef APP -- >
< image @click ="moreBtn(itemObj)" src = "@/static/images/app/icon/more.png" style = "width: 32rpx;height: 32rpx;" > < / image >
< image @click ="moreBtn(itemObj,3 )" src = "@/static/images/app/icon/more.png" style = "width: 32rpx;height: 32rpx;" > < / image >
<!-- # endif -- >
< / view >
< view class = "con_txt" @click ="replyToComments(itemObj,2 )" >
< view class = "con_txt" @click ="replyToComments(itemObj,3 )" >
< view style = "margin-bottom: 8rpx;" >
{ { itemObj . content } }
< / view >
@@ -413,7 +427,7 @@
<!-- # endif -- >
< / view >
<!-- 点击回复 ? ? ? -- >
< view class = "con_txt1" @click ="replyToComments(ele,2 )" >
< view class = "con_txt1" @click ="replyToComments(ele,3 )" >
< text class = "txt_a" > 回复 < / text >
< text class = "txt_b" > { { ele . reviewUid !== 0 ? ele . reviewUserNickname : itemObj . nickname } } < / text > :
<!-- < text class = "txt_b" > { { itemObj . nickname } } < / text > : -- >
@@ -448,7 +462,52 @@
< / view >
< view class = "pop_bottom" >
< view class = "pop_bot_txt" @click ="replyToComments(itemObj,2)" > 发表评论 < / view >
<!-- < view class = "pop_bot_txt" @click ="replyToComments(itemObj,2)" > 发表评论 < / view > - - >
< view style = "display: flex;align-items: center;justify-content: space-between;" >
< view class = "bottom_l" style = "width:540rpx" >
< textarea autoHeight fixed :showConfirmBar = "false" border = "none" :placeholder = "placeholder" maxlength = "300"
:cursor-spacing = "20" v-model = "replyAddData.content" @blur="textareaFlag = false" @focus="textareaFocusFnPop"
: style = "'background-color:#f2f0f4;border-radius: '+ 40 +'rpx;padding: 0 24rpx;hidth:72rpx'"
ref = "textareaPop" :autoFocus = "true"
@keyboardheightchange ="keyboardheightchangeFn" :focus = "focusPop" auto -blur / >
< / view >
< view class = "bottom_send" >
< view @click.stop ="emojiShow = !emojiShow,openExpression()" >
< image src = "https://jimte.oss-cn-hangzhou.aliyuncs.com/xcximage/douyin/expression.png"
style = "width: 52rpx;height: 52rpx;" / >
< / view >
< view @click.stop ="sendSMS" >
< image
src = "https://smfwq2.oss-cn-shanghai.aliyuncs.com/2023/12/25/63571017a4a042b682e1c6be08a3cdda.png"
style = "width: 52rpx;height: 52rpx;" / >
< / view >
< / view >
< / view >
< template v-if = "emojiShow" >
< view style = "width: 690rpx;" >
<!-- # ifdef APP - PLUS -- >
< waterfall column -count = " 8 " column -width = " auto " column -gap = " 0 " left -gap = " 10 "
style = "height: 400rpx;background-color: #fff;" >
< cell v-for = "(item,index) in emoicon" :key="index" style="padding: 10rpx;"
@click ="replyAddData.content += item" >
< text style = "font-size: 54rpx;" > { { item } } < / text >
< / cell >
< / waterfall >
<!-- # endif -- >
<!-- # ifndef APP - PLUS -- >
< u-list height = "400rpx" customStyle = "background-color:#fff;padding:10rpx 0;" >
< u-grid col = "10" >
< u-grid-item v-for = "(item,index) in emoicon" :key="index" @click="replyAddData.content += item"
customStyle = "margin-bottom:20rpx;" >
< u-list-item >
< text style = "font-size: 54rpx;text-align: left;" > { { item } } < / text >
< / u-list-item >
< / u-grid-item >
< / u-grid >
< / u-list >
<!-- # endif -- >
< / view >
< / template >
< / view >
< / view >
<!-- < view style = "height: 200rpx;" > < / view > -- >
@@ -541,6 +600,7 @@
borderRadius : 50 , //评论框圆角大小
autoFocus : false , //自动焦点
focus : false ,
focusPop : false ,
emoicon : [
"😁" , "😋" , "😜" , "😉" , "😌" , "😅" , "😳" , "😊" , "😝" , "😰" , "😠" , "😩" , "😲" , "😞" , "😭" , "😍" ,
"😖" , "😱" , "😡" , "😚" , "😤" , "🐼" , "🐲" , "😺" , "😸" , "😹" , "😽" , "🙀" , "🐴" , "🐮" , "🍺" , "🔥" ,
@@ -570,6 +630,7 @@
// more
showMore : false ,
moreItem : { } ,
moreNum : 2 ,
// 判断小手
IsLike : false ,
// 评论弹层
@@ -596,17 +657,28 @@
myInfo : { } ,
// 添加评论
replyAddData : {
authorUserId : null ,
content : '' ,
noteId : null ,
replyId : 0 ,
userId : null ,
image : ''
authorUserId : null , // 帖子的作者的用户ID, 移动端不传值
content : '' , // 评论/回复内容
noteId : null , // 笔记ID
replyId : 0 , // 评论ID, 一级评论传0
userId : null , // 用户ID, 移动端不传值
image : '' // 评论图片
} ,
//type==2 问答,话题
type : 1 ,
shareItem : { } ,
showNavImg : false
showNavImg : false ,
//选择当前的聊天
actPData : { } ,
//回复类型
replyType : 2 ,
//监听滚动条滑动
headerFFlag : true ,
//评论框长度
textareaFlag : false ,
contentValue : '' ,
//输入框高度
inputHeight : 0
}
} ,
@@ -660,6 +732,49 @@
}
} ,
methods : {
//表情按钮
openExpression ( ) {
uni . hideKeyboard ( ) ;
} ,
//键盘高度
keyboardheightchangeFn ( e ) {
console . log ( '键盘收起打开' , e . detail . height ) ;
this . inputHeight = e . detail . height
if ( e . detail . height == 0 ) {
this . $refs . textarea . blur ( ) ;
this . replyType = 2
} else {
this . emojiShow = false
}
} ,
//评论框聚焦
textareaFocusFn ( e ) {
console . log ( e , '评论框聚焦' )
this . textareaFlag = true
if ( this . emojiShow ) {
uni . hideKeyboard ( ) ;
this . emojiShow = false ;
this . $nextTick ( ( ) => {
// uni.openm
this . $refs . textarea . focus ( ) ;
} )
}
// console.log('焦点', this.replyType, e);
// if(this.replyType==2){
// this.replyAddData.noteId = this.noteId
// }
} ,
textareaFocusFnPop ( e ) {
if ( this . emojiShow ) {
uni . hideKeyboard ( ) ;
this . emojiShow = false ;
this . $nextTick ( ( ) => {
// uni.openm
this . $refs . textarea . focus ( ) ;
} )
}
} ,
//监听
scrollFn ( e ) {
// console.log(e,'1111');
@@ -869,6 +984,10 @@
this . itemObj = item
this . itemObj . countStart = formatNumber ( item . countStart )
this . replyListLength = item . replyList . length
this . replyAddData . replyId = item . id
this . replyAddData . userId = this . myInfo . id
this . replyAddData . noteId = this . detailObj . id
this . replyAddData . authorUserId = this . detailObj . authorId
} ,
// 去举报页
toReportPages ( ) {
@@ -877,9 +996,10 @@
} )
} ,
// 更多
moreBtn ( item ) {
moreBtn ( item , num ) {
this . showMore = true
this . moreItem = item
this . moreNum = num
} ,
// nav上的三个点按钮
dropBtn ( ) {
@@ -971,36 +1091,77 @@
}
} ) ;
} ,
// 回复评论
replyToComments ( ele , num ) {
// console.log(ele,'数据数据',num,'数字1或2');
if ( num == 2 ) {
this . placeholderReply = '回复' + ' ' + ele . nickname + ' ' + ':'
replyToCommentsCopy ( ) {
if ( this . moreNum == 2 ) {
this . showMore = false
this . showReply = true
this . replyAddData . replyId = ele . id
this . focus = true
this . replyAddData . replyId = this . moreItem . id
this . replyAddData . userId = this . myInfo . id
this . getDetail ( this . noteId )
} else {
this . showMore = false
this . showReply = true
this . replyAddData . replyId = 0
this . focusPop = true
this . replyAddData . replyId = this . moreItem . id
this . replyAddData . userId = this . myInfo . id
this . getDetail ( this . noteId )
}
} ,
// 回复评论
replyToComments ( ele , num ) {
// this.focus=false
// this.focusPop=false
console . log ( ele , '数据数据' , num , '数字1或2' )
// this.$refs.textarea.focus()
if ( num == 3 ) {
console . log ( 'pop里面的' ) ;
this . focusPop = true
this . focus = false
this . showMore = false
this . placeholderReply = '回复' + ' ' + ele . nickname + ' ' + ':'
// this.showReply=true
this . replyAddData . replyId = ele . id
this . replyAddData . userId = this . myInfo . id
this . getDetail ( this . noteId )
} else if ( num == 2 ) {
console . log ( '外面的的' ) ;
if ( this . focus == true ) this . focus = false
this . focus = true
this . focusPop = false
this . showMore = false
// this.showReply=true
this . replyAddData . replyId = ele . id
this . replyAddData . userId = this . myInfo . id
this . getDetail ( this . noteId )
} else {
console . log ( '哪都不是' ) ;
this . focus = false
this . focusPop = false
// this.focus=true
// this.showMore = false
// // this.showReply=true
// this.replyAddData.replyId=0
// this.replyAddData.userId=this.myInfo.id
// this.getDetail(this.noteId)
}
} ,
// 发送
sendSMS ( e ) {
// console.log(e,'评论1111212213');
this . replyAddData. content= e . msg
// this. replyAddData. content=e. msg
replyAddAPI ( this . replyAddData ) . then ( res => {
console . log ( res . data . replyId , 'res.replyId' ) ;
this . replyListAll . forEach ( item => {
if ( this . replyAddData . replyId == item . id) {
item . replyList . push ( res . data )
console . log ( item , 'item. id' ) ;
if ( res . data . replyId == item . id ) {
item . replyList . unshift ( res . data )
}
} )
this . $refs . paging . reload ( )
this . resetData ( )
} )
this . resetData ( )
this . focus = false
this . focusPop = false
this . showReply = false
// this.placeholder='友善评论、文明发言'
// this.placeholderReply='友善评论、文明发言'
@@ -1665,36 +1826,29 @@
}
}
. bottom _up {
border: 1 px solid red ;
// border: 1px solid red;
border - top : 1 rpx solid # EDEDED ;
width : 100 % ;
position : fixed ;
bottom : 0 ;
padding : 30 rpx 32 rpx 58 rpx ;
display: flex ;
justify- content: space - between ;
align - items : center ;
// display: flex;
// justify- content: space- between;
// align-items: center;
background - color : # fff ;
z - index : 999 ;
. bottom _l {
width : 100 % ;
}
. bottom _r {
// border: 1px solid red;
width : 350 rpx ;
display : flex ;
// align-items: center;
justify - content : space - around ;
. r _img _txt {
// border: 1px solid red;
margin - left : 40 rpx ;
display : flex ;
// flex-direction: column;
align - items : center ;
. txt {
// width: 64rpx;
font - size : 28 rpx ;
font - weight : 400 ;
color : # 666666 ;
@@ -1709,6 +1863,29 @@
}
}
}
}
. bottom _l {
// border: 1px solid red;
height : 72 rpx ;
background : # f2f0f4 ;
border - radius : 50 rpx ;
display : flex ;
align - items : center ;
justify - content : center ;
font - size : 32 rpx ;
// width: 100%;
// height: 90rpx;
}
. bottom _send {
// border: 1px solid red;
display : flex ;
// flex-direction: row;
align - items : center ;
justify - content : space - around ;
flex : 1 ;
}
. bottom {