circle page

nova-werun/components/circle-card/index.js

@@ -37,7 +37,9 @@ Component({
         poptype: '',
         userobject: '',
         //评论
-        commenttext:"评论"
+        commenttext: "评论",
+        focusedCommentId: null,
+        isCommentFocused: false
     },
     lifetimes: {
 
@@ -52,8 +54,10 @@ Component({
             this.getComment()
         },
 
+
     },
 
+
     /**
      * 组件的方法列表
      */
@@ -231,7 +235,7 @@ Component({
             this.setData({
                 show: true,
                 poptype: 'one', //直接回复
-                commenttext:'评论'
+                commenttext: '评论'
             });
             this.showgood()
         },
@@ -301,12 +305,12 @@ Component({
             }
             //回复别人评论
             if (this.data.poptype == 'two') {
-                console.log('id',this.data.userobject);
+                console.log('id', this.data.userobject);
                 this.rebackmoment()
             }
 
         },
-        //获取评论
+        // 获取评论
         async getComment() {
             let Momentquery = new Parse.Query('AIMomentComment');
             Momentquery.equalTo('company', company);
@@ -315,24 +319,30 @@ Component({
             Momentquery.notEqualTo('isDeleted', true);
             Momentquery.include('user');
             Momentquery.include('comment.user');
-        
+
             // 按照创建时间升序排列（从旧到新）
             Momentquery.ascending('createdAt'); // 或者使用 Momentquery.descending('createdAt') 以降序排列
-        
+
             let r = await Momentquery.find();
-            let commentList = r.map(item => item.toJSON());
+            let commentList = r.map(item => {
+                let comment = item.toJSON();
+                // 初始化 showdeletid 属性为 false
+                comment.showdeletid = false;
+                return comment;
+            });
             console.log('评论', commentList);
             this.setData({
                 commentList
             });
         },
-        //点击评论
-      async  showpop(e) {
-            const objectId = e.currentTarget.dataset.id
+
+        // 点击评论
+        async showpop(e) {
+            const objectId = e.currentTarget.dataset.id;
             let AIMomentCommentquery = new Parse.Query('AIMomentComment');
             AIMomentCommentquery.equalTo('company', company);
             AIMomentCommentquery.equalTo('objectId', objectId);
-            AIMomentCommentquery.notEqualTo('isDeleted', true)
+            AIMomentCommentquery.notEqualTo('isDeleted', true);
             AIMomentCommentquery.include('user');
             let r = await AIMomentCommentquery.find();
             let commentList = r.map(item => item.toJSON());
@@ -341,27 +351,62 @@ Component({
             let userquery = new Parse.Query('_User');
             userquery.equalTo('company', company);
             userquery.equalTo('objectId', currentUser.id);
-            userquery.notEqualTo('isDeleted', true)
+            userquery.notEqualTo('isDeleted', true);
             let R = await userquery.find();
             let user = R.map(item => item.toJSON());
 
-            if(user[0].objectId!=commentList[0].user.objectId){
+            // 检查是否点击了自己的评论
+            if (user[0].objectId != commentList[0].user.objectId) {
                 this.setData({
                     show: true,
                     poptype: 'two',
-                    userobject:objectId,
-                    commenttext:`回复${commentList[0].user.nickname}`
+                    userobject: objectId,
+                    commenttext: `回复${commentList[0].user.nickname}`
+                });
+            } else {
+                // 点击了自己的评论，设置对应评论的 showdeletid 为 true
+                const updatedCommentList = this.data.commentList.map(comment => {
+                    if (comment.objectId === objectId) {
+                        return {
+                            ...comment,
+                            showdeletid: true // 更新当前评论项
+                        };
+                        
+                    }
+                    return comment; // 保持其他评论项不变
+                   
+                });
+                this.setData({
+                    commentList: updatedCommentList // 更新 commentList 的状态
                 });
-            }else{
                 console.log('点击了自己');
             }
+            console.log(this.data.commentList);
+        },
 
+        // 点击其他地方重置所有评论的 showdeletid
+        onTapOutside() {
+            if (!this.data.isCommentFocused) { // 只有在没有评论聚焦时才重置
+                const updatedCommentList = this.data.commentList.map(comment => ({
+                    ...comment,
+                    showdeletid: false // 重置所有评论的 showdeletid
+                }));
 
+                this.setData({
+                    commentList: updatedCommentList,
+                    focusedCommentId: null // 清除聚焦状态
+                });
+            }
+        },
+        // 添加页面的触摸事件
+        onTouchStart() {
+            this.onTapOutside(); // 页面触摸时重置评论状态
         },
+
         //回复评论
         async rebackmoment() {
             //所属评论
-            
+
             let AIMomentCommentquery = new Parse.Query('AIMomentComment');
             AIMomentCommentquery.equalTo('company', company);
             AIMomentCommentquery.equalTo('objectId', this.data.userobject);

nova-werun/components/circle-card/index.less

@@ -275,6 +275,28 @@
                 color: #072d79;
             }
         }
+        .comment2{
+            background-color: #bfbebe;
+            width: 100%;
+            display: flex;
+            height: 60rpx;
+            align-items: center;
+            position: relative;
+            .nickname{
+                color: #072d79;
+            }
+            .delete{
+                width: 100rpx;
+                height: 50rpx;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                background-color: white;
+                position: absolute;
+                bottom: 50rpx;
+                left: 50%;
+            }
+        }
     }
     .commentbox2{
         padding-top: 10rpx;
@@ -296,5 +318,27 @@
                 color: #072d79;
             }
         }
+        .comment2{
+            background-color: #bfbebe;
+            width: 100%;
+            display: flex;
+            height: 60rpx;
+            align-items: center;
+            position: relative;
+            .nickname{
+                color: #072d79;
+            }
+            .delete{
+                width: 100rpx;
+                height: 50rpx;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                background-color: white;
+                position: absolute;
+                bottom: 50rpx;
+                left: 50%;
+            }
+        }
     }
 }

nova-werun/components/circle-card/index.wxml

@@ -1,5 +1,5 @@
 <!--nova-werun/components/circle-card/index.wxml-->
-<view class="trends-one">
+ <view class="trends-one" bindtouchstart="onTouchStart">
     <!-- 详细-->
     <view wx:if="{{type=='detail'}}" class="namebax">
         <image src="{{cicleList[0].profile.user.avatar}}"></image>
@@ -91,19 +91,21 @@
         </block>
 
     </view>
-    <view class="{{chickList.length !=0? 'commentbox' :'commentbox2' }}" wx:if="{{commentList.length!=0}}">
+    <view class="{{chickList.length !=0? 'commentbox' :'commentbox2' }}" wx:if="{{commentList.length!=0}}"   >
         <block wx:for="{{commentList}}">
-            <view class="comment" wx:if="{{!item.comment}}" bindtap="showpop" data-id="{{item.objectId}}">
+            <view class="{{item.showdeletid?'comment2':'comment'}}" wx:if="{{!item.comment}}" bindtap="showpop" data-id="{{item.objectId}}">
                 <view class="nickname">{{item.user.nickname}}</view>
                 <view>:</view>
                 <view>{{item.content}}</view>
+                <view wx:if="{{item.showdeletid}}" class="delete">删除</view>
             </view>
-            <view class="comment" wx:if="{{item.comment}}" bindtap="showpop" data-id="{{item.objectId}}">
+            <view class="{{item.showdeletid?'comment2':'comment'}}" wx:if="{{item.comment}}" bindtap="showpop" data-id="{{item.objectId}}">
                 <view class="nickname">{{item.user.nickname}}</view>
                 <view>回复</view>
                 <view class="nickname">{{item.comment.user.nickname}}</view>
                 <view>:</view>
-                <view>{{item.content}}</view>
+                <view style="flex-wrap: wrap;">{{item.content}}</view>
+                <view wx:if="{{item.showdeletid}}" class="delete">删除</view>
             </view>
         </block>