Skip to content

Great Teamwork
Great Teamwork

_milo / Great Teamwork

通知 13
Star 0
Fork 0
Great Teamwork
Great Teamwork
提交 3b94de9d 编写于 作者: 赵十四's avatar 赵十四
浏览文件
操作

帖子详情前后端交互，实现发布评论和删除帖子

上级 f4be6b0b
隐藏空白更改
内联 并排
Showing with 204 addition and 59 deletion
teamwork/manifest.json
浏览文件 @ 3b94de9d
...@@ -61,6 +61,9 @@ ...@@ -61,6 +61,9 @@
} }
} }
} }
},
"uniStatistics" : {
"enable" : true
} }
}, },
/* 快应用特有相关 */ /* 快应用特有相关 */
...@@ -83,7 +86,8 @@ ...@@ -83,7 +86,8 @@
"usingComponents" : true "usingComponents" : true
}, },
"uniStatistics" : { "uniStatistics" : {
"enable" : false "enable" : false,
"version" : "2"
}, },
"vueVersion" : "2" "vueVersion" : "2"
} }
teamwork/pages.json
浏览文件 @ 3b94de9d
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, { }, {
"path": "pages/post/post-detial", "path": "pages/post/post-detail",
"style": { "style": {
"navigationStyle": "custom" "navigationStyle": "custom"
} }
......
teamwork/pages/post/post-detial.vue → teamwork/pages/post/post-detail.vue
浏览文件 @ 3b94de9d
...@@ -9,16 +9,16 @@ ...@@ -9,16 +9,16 @@
<!-- 帖子内容 --> <!-- 帖子内容 -->
<view class="one-post"> <view class="one-post">
<view class="icon-with-name"> <view class="icon-with-name">
<image src="../../static/icon/1.png" class="icon" /> <image :src="postDetail.ownerIcon" class="icon" />
<text class="name">{{name}}</text><br /> <text class="name">{{postDetail.ownerName}}</text><br />
<text class="add-time">{{time}}</text> <text class="add-time">{{postDetail.datetime}}</text>
</view> </view>
<view class="content"> <view class="content">
<text class="text-content">{{textContent}}</text> <text class="text-content">{{postDetail.content}}</text>
<view class="img-conetent"> <view class="img-conetent">
<!-- 多张图片 --> <!-- 多张图片 -->
<view class="one-img" v-for="img in pictureList"> <view class="one-img" v-for="img in postDetail.pictureList">
<image :src="img.picture" class="post-pic" @click="showPic(img.picture)"></image> <image :src="img" class="post-pic" @click="showPic(img)"></image>
</view> </view>
</view> </view>
...@@ -27,14 +27,15 @@ ...@@ -27,14 +27,15 @@
<!-- 点赞和评论 --> <!-- 点赞和评论 -->
<view class="like-and-comment"> <view class="like-and-comment">
<!-- 删除键，只有我的帖子可见该组件 --> <!-- 删除键，只有我的帖子可见该组件 -->
<text class="del" @click="delPost">删除</text> <text class="del" @click="delPost" v-if="'6450da43e1a35c371b3699cc'==postDetail.ownerId">删除</text>
<view class="icon-and-num"> <view class="icon-and-num">
<image class="like-icon" :src="isLike==1?'../../static/post/喜欢2.png':'../../static/post/喜欢.png'" <image class="like-icon"
:src="postDetail.islike==1?'../../static/post/喜欢2.png':'../../static/post/喜欢.png'"
style="width: 16px;height:16px;" @click="changeLike" /> style="width: 16px;height:16px;" @click="changeLike" />
<text style="font-size: 12px;">{{like}}</text> <text style="font-size: 12px;">{{postDetail.likes}}</text>
<image class="comment-icon" :src="'../../static/post/评论.png'" <image class="comment-icon" :src="'../../static/post/评论.png'"
style="width: 16px;height: 16px;margin-left: 10px;" @click="addComment()" /> style="width: 16px;height: 16px;margin-left: 10px;" @click="addComment()" />
<text style="font-size: 12px;">{{comment}}</text> <text style="font-size: 12px;">{{postDetail.comments}}</text>
</view> </view>
</view> </view>
...@@ -46,7 +47,7 @@ ...@@ -46,7 +47,7 @@
<!-- 评论区 --> <!-- 评论区 -->
<view class="comment-content"> <view class="comment-content">
<!-- 评论数 --> <!-- 评论数 -->
<text class="comment-size">评论 120</text> <text class="comment-size">评论 {{postDetail.comments}}</text>
<!-- 点击进入评论 --> <!-- 点击进入评论 -->
<view class="comment"> <view class="comment">
<image <image
...@@ -55,23 +56,25 @@ ...@@ -55,23 +56,25 @@
<span @click="addComment" class="comment-buttun"><text <span @click="addComment" class="comment-buttun"><text
style="margin-left:8px;margin-top: 5px;float: left">写评论</text></span> style="margin-left:8px;margin-top: 5px;float: left">写评论</text></span>
</view> </view>
<!-- 评论内容 --> <!-- 评论内容 -->
<view class="one-comment"> <view v-for="(item,index) in postDetail.commentList">
<image <view class="one-comment">
:src="'https://mp-6f6feaec-a026-4402-8e8d-18f7572890da.cdn.bspapp.com/cloudstorage/becea65c-89d7-4fe0-9c3f-2e08cdf911e8.jpg'" <image :src="item.commenterIcon" class="icon-small" />
class="icon-small" /> <text class="name-small">{{item.commenterName}}</text><br />
<text class="name-small">{{name}}</text><br /> <text class="comment-text-content">{{item.commentContent}}</text><br />
<text class="comment-text-content">11111111111111111111111111111111111111111111111111111111</text><br /> <!-- 时间和点赞 -->
<!-- 时间和点赞 --> <view class="like-and-time">
<view class="like-and-time"> <text class="add-time">{{item.commentDatetime}}</text>
<text class="add-time">{{time}}</text> <view class="icon-and-num">
<view class="icon-and-num"> <image class="like-icon"
<image class="like-icon" :src="isLike==1?'../../static/post/喜欢2.png':'../../static/post/喜欢.png'" :src="item.islike==1?'../../static/post/喜欢2.png':'../../static/post/喜欢.png'"
style="width: 16px;height:16px;" @click="changeLike" /> style="width: 16px;height:16px;" @click="changeCommentLike(index)" />
<text style="font-size: 12px;">{{like}}</text> <text style="font-size: 12px;">{{item.commentLikes}}</text>
</view>
</view> </view>
<u-line color="#EDEEF0"></u-line>
</view> </view>
<u-line color="#EDEEF0"></u-line>
</view> </view>
</view> </view>
...@@ -84,7 +87,7 @@ ...@@ -84,7 +87,7 @@
<!-- 是否删除 --> <!-- 是否删除 -->
<uni-popup ref="alertDialog" type="dialog"> <uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog cancelText="取消" confirmText="确定" title="警告" content="确定删除该帖子吗？" <uni-popup-dialog cancelText="取消" confirmText="确定" title="警告" content="确定删除该帖子吗？"
@confirm="dialogConfirm"></uni-popup-dialog> @confirm="dialogConfirm"></uni-popup-dialog>
</uni-popup> </uni-popup>
...@@ -103,6 +106,7 @@ ...@@ -103,6 +106,7 @@
name: '昵称', name: '昵称',
time: '2023.10.3 11:19', time: '2023.10.3 11:19',
textContent: '今日打卡', textContent: '今日打卡',
postId: "",
like: 200, like: 200,
isLike: 1, isLike: 1,
comment: 120, comment: 120,
...@@ -118,35 +122,87 @@ ...@@ -118,35 +122,87 @@
], ],
postDetail: [],
}; };
}, },
methods: { methods: {
onLoad(e) {
//this.from=e.from;
this.postId = e.postId;
this.getData();
},
getData() {
uniCloud.callFunction({
name: 'fe-college-postDetail',
data: { //向云函数中传入的数据
userId: "6450da43e1a35c371b3699cc",
postId: this.postId
},
})
.then(res => {
this.postDetail = res.result.data;
console.log(res.result.data);
});
},
//删除确认弹窗 //删除确认弹窗
delPost() { delPost() {
this.$refs.alertDialog.open(); this.$refs.alertDialog.open();
}, },
//删除帖子
dialogConfirm() { dialogConfirm() {
console.log('点击确认') uniCloud.callFunction({
name: 'fe-college-deletePost',
data: { //向云函数中传入的数据
postId: this.postId
},
})
.then(res => {
if (res.result.code == 200) {
uni.showToast({
title: '删除成功',
duration: 2000,
success: () => {
setTimeout(() => {
uni.navigateBack()
}, 2000)
}
})
}
});
this.$refs.alertDialog.close(); this.$refs.alertDialog.close();
}, },
dialogClose() { dialogClose() {
console.log('点击关闭') console.log('点击关闭')
this.$refsalertDialog.close(); this.$refsalertDialog.close();
}, },
//输入评论
//发布评论
confirm(value) { confirm(value) {
// 输入框的值 // 输入框的值
console.log(value) console.log(value)
uniCloud.callFunction({
name: 'fe-college-commentPost',
data: { //向云函数中传入的数据
userId: "6450da43e1a35c371b3699cc",
postId: this.postId,
content: value
},
})
.then(res => {
// this.postDetail = res.result.data;
this.getData();
console.log(res.result.data);
});
this.$refs.popup.close(); this.$refs.popup.close();
uni.showTabBar();
}, },
//新增评论 //评论窗口
addComment() { addComment() {
this.$refs.popup.open(); this.$refs.popup.open();
uni.hideTabBar();
}, },
close() { close() {
this.$refs.popup.close(); this.$refs.popup.close();
...@@ -175,23 +231,99 @@ ...@@ -175,23 +231,99 @@
this.isLike = 1; this.isLike = 1;
} }
}, },
//新增评论
addComment() { //点赞状态改变
this.$refs.popup.open(); changeLike() {
uni.hideTabBar();
}, //已经点赞
close() { if (this.postDetail.islike == 1) {
this.$refs.popup.close(); // console.log(this.allPost[index].postId);
uni.showTabBar(); //取消点赞
}, uniCloud.callFunction({
//输入评论 name: 'fe-college-likePost',
confirm(value) { data: { //向云函数中传入的数据
// 输入框的值 userId: "6450da43e1a35c371b3699cc",
console.log(value) postId: this.postId,
this.$refs.popup.close(); },
uni.showTabBar(); })
.then(res => {
// this.allPost=res.result.data.postList;
if (res.result.code == 200) {
this.postDetail.islike = 0;
this.postDetail.likes = res.result.data.newlikes;
}
// console.log(res.result);
});
} else {
//点赞
uniCloud.callFunction({
name: 'fe-college-likePost',
data: { //向云函数中传入的数据
userId: "6450da43e1a35c371b3699cc",
postId: this.postId,
},
})
.then(res => {
// this.allPost=res.result.data.postList;
if (res.result.code == 200) {
this.postDetail.islike = 1;
this.postDetail.likes = res.result.data.newlikes;
}
// console.log(res.result);
});
}
}, },
//改变评论的点赞状态
changeCommentLike(index) {
//已经点赞
if (this.postDetail.commentList[index].islike == 1) {
// console.log(this.allPost[index].postId);
//取消点赞
uniCloud.callFunction({
name: 'fe-college-likeComment',
data: { //向云函数中传入的数据
userId: "6450da43e1a35c371b3699cc",
commentId: this.postDetail.commentList[index].commentId
},
})
.then(res => {
// this.allPost=res.result.data.postList;
if (res.result.code == 200) {
this.postDetail.commentList[index].islike = 0;
console.log(res.result);
this.postDetail.commentList[index].commentLikes = res.result.data.newlikes;
}
console.log(res.result);
});
} else {
//点赞
uniCloud.callFunction({
name: 'fe-college-likeComment',
data: { //向云函数中传入的数据
userId: "6450da43e1a35c371b3699cc",
commentId: this.postDetail.commentList[index].commentId
},
})
.then(res => {
// this.allPost=res.result.data.postList;
if (res.result.code == 200) {
this.postDetail.commentList[index].islike = 1;
this.postDetail.commentList[index].commentLikes = res.result.data.newlikes;
}
// console.log(res.result);
});
}
}
} }
} }
......
teamwork/pages/post/post.vue
浏览文件 @ 3b94de9d
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<view v-if="current == 1"> <view v-if="current == 1">
<view v-for="(item,index) in allPost" :key="index"> <view v-for="(item,index) in allPost" :key="index">
<!-- 单个帖子 --> <!-- 单个帖子 -->
<view class="one-post" @click="toDetial"> <view class="one-post" @click="toDetial(item.postId)">
<view class="icon-with-name"> <view class="icon-with-name">
<image :src="item.usericon" class="icon" /> <image :src="item.usericon" class="icon" />
<text class="name">{{item.username}}</text> <text class="name">{{item.username}}</text>
...@@ -30,12 +30,12 @@ ...@@ -30,12 +30,12 @@
<view class="img-conetent"> <view class="img-conetent">
<!-- 多张图片 --> <!-- 多张图片 -->
<view v-if="item.pictureList.length!=1" class="one-img" v-for="img in item.pictureList"> <view v-if="item.pictureList.length!=1" class="one-img" v-for="img in item.pictureList">
<image :src="img" class="post-pic" @click="showPic(img)"></image> <image :src="img" class="post-pic" @click.stop="showPic(img)"></image>
</view> </view>
<!-- 单张图片 --> <!-- 单张图片 -->
<view v-if="item.pictureList.length == 1"> <view v-if="item.pictureList.length == 1">
<image :src="item.pictureList[0]" class="single-pic" <image :src="item.pictureList[0]" class="single-pic"
@click="showPic(item.pictureList[0])"></image> @click.stop="showPic(item.pictureList[0])"></image>
</view> </view>
</view> </view>
</view> </view>
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
<!-- 单个帖子 --> <!-- 单个帖子 -->
<view v-for="(item,index) in myPost" :key="index"> <view v-for="(item,index) in myPost" :key="index">
<!-- 单个帖子 --> <!-- 单个帖子 -->
<view class="one-post" @click="toDetial"> <view class="one-post" @click="toDetial(item.postId)">
<view class="icon-with-name"> <view class="icon-with-name">
<image :src="item.usericon" class="icon" /> <image :src="item.usericon" class="icon" />
<text class="name">{{item.username}}</text> <text class="name">{{item.username}}</text>
...@@ -75,12 +75,12 @@ ...@@ -75,12 +75,12 @@
<view class="img-conetent"> <view class="img-conetent">
<!-- 多张图片 --> <!-- 多张图片 -->
<view v-if="item.pictureList.length!=1" class="one-img" v-for="img in item.pictureList"> <view v-if="item.pictureList.length!=1" class="one-img" v-for="img in item.pictureList">
<image :src="img" class="post-pic" @click="showPic(img)"></image> <image :src="img" class="post-pic" @click.stop="showPic(img)"></image>
</view> </view>
<!-- 单张图片 --> <!-- 单张图片 -->
<view v-if="item.pictureList.length == 1"> <view v-if="item.pictureList.length == 1">
<image :src="item.pictureList[0]" class="single-pic" <image :src="item.pictureList[0]" class="single-pic"
@click="showPic(item.pictureList[0])"></image> @click.stop="showPic(item.pictureList[0])"></image>
</view> </view>
</view> </view>
</view> </view>
...@@ -109,11 +109,20 @@ ...@@ -109,11 +109,20 @@
<script> <script>
export default { export default {
onPullDownRefresh() {
this.getAllPost();
this.getMyPost();
},
onLoad() { onLoad() {
this.getAllPost(); this.getAllPost();
this.getMyPost(); this.getMyPost();
},
onShow() {
this.getAllPost();
this.getMyPost();
}, },
data() { data() {
return { return {
...@@ -144,9 +153,9 @@ ...@@ -144,9 +153,9 @@
}, },
methods: { methods: {
toDetial() { toDetial(postId) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/post/post-detial' url: '/pages/post/post-detail?postId=' + postId
}) })
}, },
tabChange(index) { tabChange(index) {
...@@ -195,7 +204,7 @@ ...@@ -195,7 +204,7 @@
console.log(res.result.data); console.log(res.result.data);
}); });
}, },
// 图片放大 // 图片放大
showPic(imgUrl) { showPic(imgUrl) {
let arr = []; let arr = [];
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或