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 @@
}
}
}
},
"uniStatistics" : {
"enable" : true
}
},
/* 快应用特有相关 */
......@@ -83,7 +86,8 @@
"usingComponents" : true
},
"uniStatistics" : {
"enable" : false
"enable" : false,
"version" : "2"
},
"vueVersion" : "2"
}
teamwork/pages.json
浏览文件 @ 3b94de9d
......@@ -121,7 +121,7 @@
"navigationStyle": "custom"
}
}, {
"path": "pages/post/post-detial",
"path": "pages/post/post-detail",
"style": {
"navigationStyle": "custom"
}
......
teamwork/pages/post/post-detial.vue → teamwork/pages/post/post-detail.vue
浏览文件 @ 3b94de9d
......@@ -9,16 +9,16 @@
<!-- 帖子内容 -->
<view class="one-post">
<view class="icon-with-name">
<image src="../../static/icon/1.png" class="icon" />
<text class="name">{{name}}</text><br />
<text class="add-time">{{time}}</text>
<image :src="postDetail.ownerIcon" class="icon" />
<text class="name">{{postDetail.ownerName}}</text><br />
<text class="add-time">{{postDetail.datetime}}</text>
</view>
<view class="content">
<text class="text-content">{{textContent}}</text>
<text class="text-content">{{postDetail.content}}</text>
<view class="img-conetent">
<!-- 多张图片 -->
<view class="one-img" v-for="img in pictureList">
<image :src="img.picture" class="post-pic" @click="showPic(img.picture)"></image>
<view class="one-img" v-for="img in postDetail.pictureList">
<image :src="img" class="post-pic" @click="showPic(img)"></image>
</view>
</view>
......@@ -27,14 +27,15 @@
<!-- 点赞和评论 -->
<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">
<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" />
<text style="font-size: 12px;">{{like}}</text>
<text style="font-size: 12px;">{{postDetail.likes}}</text>
<image class="comment-icon" :src="'../../static/post/评论.png'"
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>
......@@ -46,7 +47,7 @@
<!-- 评论区 -->
<view class="comment-content">
<!-- 评论数 -->
<text class="comment-size">评论 120</text>
<text class="comment-size">评论 {{postDetail.comments}}</text>
<!-- 点击进入评论 -->
<view class="comment">
<image
......@@ -55,23 +56,25 @@
<span @click="addComment" class="comment-buttun"><text
style="margin-left:8px;margin-top: 5px;float: left">写评论</text></span>
</view>
<!-- 评论内容 -->
<view class="one-comment">
<image
:src="'https://mp-6f6feaec-a026-4402-8e8d-18f7572890da.cdn.bspapp.com/cloudstorage/becea65c-89d7-4fe0-9c3f-2e08cdf911e8.jpg'"
class="icon-small" />
<text class="name-small">{{name}}</text><br />
<text class="comment-text-content">11111111111111111111111111111111111111111111111111111111</text><br />
<!-- 时间和点赞 -->
<view class="like-and-time">
<text class="add-time">{{time}}</text>
<view class="icon-and-num">
<image class="like-icon" :src="isLike==1?'../../static/post/喜欢2.png':'../../static/post/喜欢.png'"
style="width: 16px;height:16px;" @click="changeLike" />
<text style="font-size: 12px;">{{like}}</text>
<view v-for="(item,index) in postDetail.commentList">
<view class="one-comment">
<image :src="item.commenterIcon" class="icon-small" />
<text class="name-small">{{item.commenterName}}</text><br />
<text class="comment-text-content">{{item.commentContent}}</text><br />
<!-- 时间和点赞 -->
<view class="like-and-time">
<text class="add-time">{{item.commentDatetime}}</text>
<view class="icon-and-num">
<image class="like-icon"
:src="item.islike==1?'../../static/post/喜欢2.png':'../../static/post/喜欢.png'"
style="width: 16px;height:16px;" @click="changeCommentLike(index)" />
<text style="font-size: 12px;">{{item.commentLikes}}</text>
</view>
</view>
<u-line color="#EDEEF0"></u-line>
</view>
<u-line color="#EDEEF0"></u-line>
</view>
</view>
......@@ -84,7 +87,7 @@
<!-- 是否删除 -->
<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>
</uni-popup>
......@@ -103,6 +106,7 @@
name: '昵称',
time: '2023.10.3 11:19',
textContent: '今日打卡',
postId: "",
like: 200,
isLike: 1,
comment: 120,
......@@ -118,35 +122,87 @@
],
postDetail: [],
};
},
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() {
this.$refs.alertDialog.open();
},
//删除帖子
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();
},
dialogClose() {
console.log('点击关闭')
this.$refsalertDialog.close();
},
//输入评论
//发布评论
confirm(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();
uni.showTabBar();
},
//新增评论
//评论窗口
addComment() {
this.$refs.popup.open();
uni.hideTabBar();
},
close() {
this.$refs.popup.close();
......@@ -175,23 +231,99 @@
this.isLike = 1;
}
},
//新增评论
addComment() {
this.$refs.popup.open();
uni.hideTabBar();
},
close() {
this.$refs.popup.close();
uni.showTabBar();
},
//输入评论
confirm(value) {
// 输入框的值
console.log(value)
this.$refs.popup.close();
uni.showTabBar();
//点赞状态改变
changeLike() {
//已经点赞
if (this.postDetail.islike == 1) {
// console.log(this.allPost[index].postId);
//取消点赞
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 = 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 @@
<view v-if="current == 1">
<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">
<image :src="item.usericon" class="icon" />
<text class="name">{{item.username}}</text>
......@@ -30,12 +30,12 @@
<view class="img-conetent">
<!-- 多张图片 -->
<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 v-if="item.pictureList.length == 1">
<image :src="item.pictureList[0]" class="single-pic"
@click="showPic(item.pictureList[0])"></image>
@click.stop="showPic(item.pictureList[0])"></image>
</view>
</view>
</view>
......@@ -64,7 +64,7 @@
<!-- 单个帖子 -->
<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">
<image :src="item.usericon" class="icon" />
<text class="name">{{item.username}}</text>
......@@ -75,12 +75,12 @@
<view class="img-conetent">
<!-- 多张图片 -->
<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 v-if="item.pictureList.length == 1">
<image :src="item.pictureList[0]" class="single-pic"
@click="showPic(item.pictureList[0])"></image>
@click.stop="showPic(item.pictureList[0])"></image>
</view>
</view>
</view>
......@@ -109,11 +109,20 @@
<script>
export default {
onPullDownRefresh() {
this.getAllPost();
this.getMyPost();
},
onLoad() {
this.getAllPost();
this.getMyPost();
},
onShow() {
this.getAllPost();
this.getMyPost();
},
data() {
return {
......@@ -144,9 +153,9 @@
},
methods: {
toDetial() {
toDetial(postId) {
uni.navigateTo({
url: '/pages/post/post-detial'
url: '/pages/post/post-detail?postId=' + postId
})
},
tabChange(index) {
......@@ -195,7 +204,7 @@
console.log(res.result.data);
});
},
// 图片放大
showPic(imgUrl) {
let arr = [];
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或