circle page

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

@@ -24,7 +24,15 @@ Component({
         cicleList: [],
         time: '',
         //点赞人
-        chickList: ''
+        chickList: '',
+
+        show: false,
+        //
+        inputValue: '',     // 用于存储输入的内容
+        textareaHeight: 52 , // 初始高度，单位为 rpx
+        bottomNavHeight:0,
+        //
+        commentList:[],
     },
     lifetimes: {
 
@@ -35,6 +43,8 @@ Component({
             // 在组件实例进入页面节点树时执行
             this.getcircle()
             this.showischick()
+            this.getbottomheight()
+            this.getComment()
         },
 
     },
@@ -210,6 +220,94 @@ Component({
             this.setData({
                 chickList
             })
+        },
+        //显示弹出层
+        showPopup() {
+            this.setData({ show: true });
+            this.showgood()
+          },
+        
+          onClose() {
+            this.setData({ show: false });
+          },
+          //输入框高度随字体增多而变大
+          onInput: function(event) {
+            const value = event.detail.value; // 获取当前输入的值
+            this.setData({
+                inputValue: value,
+                textareaHeight: this.calculateHeight(value) // 动态计算高度
+            });
+        },
+    
+        calculateHeight: function(value) {
+            // 计算文本高度的逻辑，返回合适的高度
+            // 这里可以根据实际情况调整
+            const lineHeight = 40; // 设置行高
+            const lines = Math.ceil(value.length / 30); // 假设每行30个字符
+            return Math.max(52, lines * lineHeight); // 确保最小高度为52rpx
+        },
+        //  发送评论
+        async sendComment() {
+            let AIMomentquery = new Parse.Query('AIMoment');
+            AIMomentquery.equalTo('company', company);
+            AIMomentquery.equalTo('objectId', this.data.objectId);
+            AIMomentquery.equalTo('isVisible', true);
+            AIMomentquery.notEqualTo('isDeleted', true)
+            let P = await AIMomentquery.first();
+
+            const currentUser = Parse.User.current();
+            let userquery = new Parse.Query('_User');
+            userquery.equalTo('company', company);
+            userquery.equalTo('objectId', currentUser.id);
+            userquery.notEqualTo('isDeleted', true)
+            let user = await userquery.first();
+
+            let companyPointer = Parse.Object.extend('Company').createWithoutData(company);
+            let Comment = new Parse.Object('AIMomentComment');
+            Comment.set('moment', P.toPointer())
+            Comment.set('company', companyPointer);
+            Comment.set('type', 'coment');
+            Comment.set('isDeleted', false);
+            Comment.set('content', this.data.inputValue);
+            Comment.set('user', user.toPointer());
+            try {
+                let saveDate2 = await Comment.save();
+                console.log(saveDate2);
+                console.log("新数据保存成功");
+            } catch (error) {
+                console.error("保存数据时出现错误:", error);
+            }
+            // 处理发送评论的逻辑
+            console.log(this.data.inputValue);
+            // 清空输入框
+            this.setData({
+                inputValue: '',
+                textareaHeight: 52 // 重置高度
+            });
+        },
+        //获取评论
+        async getComment(){
+            let Momentquery = new Parse.Query('AIMomentComment');
+            Momentquery.equalTo('company', company);
+            Momentquery.equalTo('type', 'coment');
+            Momentquery.equalTo('moment', this.data.objectId);
+            Momentquery.notEqualTo('isDeleted', true)
+            Momentquery.include('user')
+            Momentquery.include('comment.user')
+            let r = await Momentquery.find();
+            let commentList = r.map(item => item.toJSON());
+            console.log('评论',commentList);
+            this.setData({
+                commentList
+            })
+        },
+        //计算底部高度
+        getbottomheight(){
+            const systemInfo = wx.getSystemInfoSync();
+            const bottomNavHeight = systemInfo.screenHeight - systemInfo.safeArea.bottom || 0;
+            this.setData({
+                bottomNavHeight,
+            });
         }
     }
 })

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

@@ -1,6 +1,7 @@
 {
     "component": true,
     "usingComponents": {
-        "van-icon": "@vant/weapp/icon/index"
+        "van-icon": "@vant/weapp/icon/index",
+        "van-popup": "@vant/weapp/popup/index"
     }
 }

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

@@ -196,8 +196,6 @@
     .chinkinbox{
         padding-top: 10rpx;
         padding-bottom: 10rpx;
-    
-        border-radius: 15rpx;
         margin-left: 90rpx;
         display: flex;
         background-color: #efefef;
@@ -209,4 +207,94 @@
             margin-left: 8rpx;
         }
     }
+    .sending{
+        background-color: #efefef;
+        display: flex;
+        padding-top: 20rpx;
+        padding-left: 20rpx;
+        width: 100%;
+        height: 80rpx;
+        position: relative;
+        .textarea{
+            background-color: white;
+            width: 600rpx;
+            border-radius: 15rpx;
+            padding-left: 12rpx;
+        }
+        .button{
+            position: absolute; /* 设置为绝对定位 */
+            bottom: 18rpx; /* 距离底部10rpx */
+            right: 10rpx; /* 距离右侧10rpx */
+            width: 100rpx;
+            height: 50rpx;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 28rpx;
+            background-color: #29b129;
+            margin-left: 10rpx;
+            border-radius: 15rpx;
+            color: white;
+
+        }
+        .button2{
+            position: absolute; /* 设置为绝对定位 */
+            bottom: 18rpx; /* 距离底部10rpx */
+            right: 10rpx; /* 距离右侧10rpx */
+            width: 100rpx;
+            height: 50rpx;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 28rpx;
+            background-color: white;
+            margin-left: 10rpx;
+            border-radius: 15rpx;
+            color: gray;
+            border: gray solid 1px;
+        }
+    }
+    .commentbox{
+        padding-top: 10rpx;
+        padding-bottom: 10rpx;
+        margin-left: 90rpx;
+        display: flex;
+        flex-direction: column;
+        background-color: #efefef;
+        align-items: center;
+        padding-left: 18rpx;
+        flex-wrap: wrap;
+        border-top: gray solid 0.1px;
+        font-size: 28rpx;
+        .comment{
+            width: 100%;
+            display: flex;
+            height: 60rpx;
+            align-items: center;
+            .nickname{
+                color: #072d79;
+            }
+        }
+    }
+    .commentbox2{
+        padding-top: 10rpx;
+        padding-bottom: 10rpx;
+        margin-left: 90rpx;
+        display: flex;
+        flex-direction: column;
+        background-color: #efefef;
+        align-items: center;
+        padding-left: 18rpx;
+        flex-wrap: wrap;
+        font-size: 28rpx;
+        .comment{
+            width: 100%;
+            display: flex;
+            height: 60rpx;
+            align-items: center;
+            .nickname{
+                color: #072d79;
+            }
+        }
+    }
 }

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

@@ -66,14 +66,22 @@
                     <view class="text2">取消</view>
                 </view>
                 |
-                <view class="function1">
+                <view class="function1" bindtap="showPopup">
                     <van-icon name="chat-o" />
                     <view class="text2">评论</view>
                 </view>
             </view>
         </view>
         <view class="point" bindtap="showgood"> ·· </view>
+        <van-popup show="{{ show }}" position="bottom" custom-style="height: {{bottomNavHeight+textareaHeight+70}}rpx;" bind:close="onClose" overlay-style='background-color: rgba(255, 255, 255, 0); ' custom-style='background-color: #efefef;'>
 
+            <view class='sending' style="height: {{textareaHeight+40}}rpx;">
+                <textarea placeholder="评论" class="textarea" style="height: {{textareaHeight}}rpx;" bindinput="onInput" value="{{inputValue}}"></textarea>
+                <view class="button2" wx:if="{{!inputValue}}">发送</view>
+                <view class="button" wx:if="{{inputValue}}" bindtap="sendComment">发送</view>
+            </view>
+
+        </van-popup>
     </view>
     <view class="chinkinbox" wx:if="{{chickList.length!=0}}">
         <van-icon name="like-o" size='18' />
@@ -83,4 +91,21 @@
         </block>
 
     </view>
+    <view class="{{chickList.length !=0? 'commentbox' :'commentbox2' }}" wx:if="{{commentList.length!=0}}">
+        <block wx:for="{{commentList}}">
+            <view class="comment" wx:if="{{!item.comment}}">
+                <view class="nickname">{{item.user.nickname}}</view>
+                <view>:</view>
+                <view>{{item.content}}</view>
+            </view>
+            <view class="comment" wx:if="{{item.comment}}">
+                <view class="nickname">{{item.user.nickname}}</view>
+                <view>回复</view>
+                <view class="nickname">{{item.comment.user.nickname}}</view>
+                <view>:</view>
+                <view>{{item.content}}</view>
+            </view>
+        </block>
+
+    </view>
 </view>