hz/fe-student
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-student.git synced 2025-12-18 23:36:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

讨论

Browse Source
This commit is contained in:
yuping
2022-12-12 12:29:04 +08:00
parent 8227ce538c
commit ea0d1f6fa6
4 changed files with 130 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

168
src/views/discussdetail/DiscussDetail.vue
View File

@@ -37,37 +37,36 @@
<!-- 中间部分 -->
<div class="middletitle">
<div class="title">
{{ disDetail.discussName }}
{{ disDetail.projectName }}
</div>
<!--todo #帖子评论详情 回复功能点击后去哪里-->
<button class="btn">回复</button>
</div>
<div class="line clearfix">
<div class="linetitle">{{ disDetail.discussExplain }}</div>
<div class="linetitle">{{ disDetail.stageName }}</div>
<div class="radi"></div>
<!--todo #帖子评论详情 缺少状态字段-->
<div class="intime">进行中</div>
</div>
<div class="discusscontent clearfix">
<div class="contenttop clearfix">
<div class="contenttitle">{{ data.discussSubmitTitle }}</div>
<div @click="like(data.discussId)"
<div class="contenttitle">{{ disDetail.discussName }}</div>
<div @click="like()"
style="display: flex;cursor: pointer;align-items: baseline;margin-left: 20px">
<span class="iconfont icon-dianzan" :style="{color:data.isLike?'red':'#b3bdc4',marginLeft: '19px'}"></span>
<div class="count"> {{ data.discussLikeCount }}</div>
<span class="iconfont icon-dianzan"
:style="{color:disDetail.praised?'red':'#b3bdc4',marginLeft: '19px'}"></span>
<div class="count"> {{ disDetail.praiseNum || 0 }}</div>
</div>
<div @click="collection(data.discussId)"
<div @click="collection()"
style="display: flex;cursor: pointer;align-items: baseline;margin-left: 20px">
<span class="iconfont icon-shoucang"
:style="{color:data.isCollection?'red':'#b3bdc4',marginLeft: '19px'}"></span>
<div class="count"> {{ data.discussCollectionCount }}</div>
:style="{color: disDetail.collected?'red':'#b3bdc4',marginLeft: '19px'}"></span>
<div class="count"> {{ disDetail.collectionNum || 0 }}</div>
</div>
</div>
<div class="contentmid">
{{ data.discussSubmitTitle }}
{{ disDetail.discussExplain }}
</div>
</div>
</div>
@@ -75,15 +74,14 @@
<div class="bascinfor">
<div class="inputone">
<el-input
v-model="textarea1"
v-model="disComment.content"
:autosize="{ minRows: 5, maxRows: 5 }"
resize="none"
maxlength="100"
type="textarea"
placeholder="写评论~"
@input="textareaInput"
/>
<div class="words">{{ textarealength }}/100</div>
<div class="words">{{ disComment.content.length }}/100</div>
<div class="upload">
<div style="display: flex">
<div class="allimg" v-for="(img,i) in commentSubmitFileList">
@@ -105,62 +103,61 @@
<div class="thinline"></div>
<div class="bottom">
<div v-for="(row,i) in data.submitReviewVoList">
<div v-for="(row,i) in commontList">
<div class="header">
<div class="avator"></div>
<div class="id">{{ row.stuName }}</div>
<!--todo #帖子评论详情 评论人名称后面有个（显示事业）？-->
<div class="id">{{ row.userName }}</div>
<div class="showCareer">(显示事业)</div>
<div class="idThink">理性思考，崇尚科学</div>
</div>
<div class="discuss clearfix">
<div class="discussmain clearfix">
<div class="talkmain">
{{ row.discussReviewContent }}
{{ row.content }}
</div>
</div>
<!--todo #帖子评论详情 评论评论中缺少点赞数 是否点赞字段-->
<div class="intime">{{ row.createTime }}</div>
<div class="intime">{{ row.ctime }}</div>
<div class="likeYou">
<div @click="commentComment(row)" style="display: flex;cursor: pointer;align-items: baseline;">
<span class="iconfont icon-pinglun" :style="{color:'#b3bdc4'}"></span>
<div class="count"> {{ row.discussLikeCount }}</div>
<span class="iconfont icon-pinglun"
:style="{color:'#b3bdc4'}"></span>
<!-- <div class="count"> {{ row.praiseNum || 0 }}</div>-->
</div>
<div @click="commentLike(row)"
style="display: flex;cursor: pointer;align-items: baseline;margin-left: 19px">
<span class="iconfont icon-shoucang"
:style="{color:data.submitReviewVoList[i].isLike?'red':'#b3bdc4'}"></span>
<div class="count"> {{ row.discussLikeCount }}</div>
<span class="iconfont icon-dianzan"
:style="{color:row.praised?'red':'#b3bdc4'}"></span>
<div class="count"> {{ row.praiseNum || 0 }}</div>
</div>
</div>
<div v-for="(replay,j) in row.submitReplyVoList">
<div v-for="(replay,j) in row.children">
<div class="reply">
<div class="sameava avaone"></div>
<div class="sameuser">{{ replay.stuName }}</div>
<div class="sameuser">{{ replay.userName }}</div>
<div class="centerreply">回复</div>
<div class="sameava avatwo"></div>
<div class="sameuser">{{ row.stuName }}</div>
<div class="replytime">{{ replay.createTime }}</div>
<div class="sameuser">{{ row.userName }}</div>
<div class="replytime">{{ replay.ctime }}</div>
</div>
<div class="allreplyimg">
<div class="singleimg"></div>
</div>
<div class="mainreply">
<div class="replydetail">
{{ replay.replyContent }}
{{ replay.content }}
</div>
<!-- <div class="talk"></div> -->
</div>
<div class="likeYou">
<div @click="commentComment(replay)" style="display: flex;cursor: pointer;align-items: baseline;">
<span class="iconfont icon-pinglun" :style="{color:'#b3bdc4'}"></span>
<div class="count"> {{ replay.discussLikeCount }}</div>
<!-- <div class="count"> {{ replay.commentNum }}</div>-->
</div>
<div @click="commentLike(replay)"
style="display: flex;cursor: pointer;align-items: baseline;margin-left: 19px">
<span class="iconfont icon-shoucang"
:style="{color:replay.isLike?'red':'#b3bdc4'}"></span>
<div class="count"> {{ replay.discussLikeCount }}</div>
<span class="iconfont icon-dianzan"
:style="{color:replay.praised?'red':'#b3bdc4'}"></span>
<div class="count"> {{ replay.praiseNum || 0 }}</div>
</div>
</div>
</div>
@@ -171,15 +168,14 @@
<div class="discuss clearfix">
<div class="inreply">
<el-input
v-model="textarea2"
v-model="replayComment.content"
:autosize="{ minRows: 5, maxRows: 5 }"
resize="none"
maxlength="100"
type="textarea"
@input="textareaInputdown"
:placeholder="placeholder"
:placeholder="replayComment.placeholder"
/>
<div class="words">{{ textarealength2 }}/100</div>
<div class="words">{{ replayComment.content.length }}/100</div>
<div class="upload">
<div style="display: flex">
<div class="allimg" v-for="(img,i) in fileList">
@@ -194,8 +190,7 @@
<div class="shangchuan">上传图片</div>
</button>
</UploadImg>
<!--todo #帖子评论详情 评论和回复评论的层级关系 只有2级？-->
<button class="btntwo">发表</button>
<button class="btntwo" @click="submitReplayComment">发表</button>
</datagrid>
</div>
</div>
@@ -209,51 +204,33 @@
<script setup>
import {reactive, ref, toRefs} from "vue";
import {useRoute} from "vue-router/dist/vue-router";
import {request, useRequest} from "@/api/request";
import {request, usePage, useRequest} from "@/api/request";
import {
DISCUSS_COLLECTION,
COMMENT_ADD,
COMMENT_COLLECTION,
COMMENT_LIST, COMMENT_PRAISE,
DISCUSS_DETAIL,
DISCUSS_LIKE,
DISCUSS_LIST,
DISCUSS_SUBMIT_REVIEW_LIST,
FILE_UPLOAD
} from "@/api/api";
import UploadImg from '@/components/img/UploadImg.vue'
const {query: {id: discussSubmitId, discussId}} = useRoute()
const {query: {id, discussSubmitId}} = useRoute()
const {data} = useRequest(DISCUSS_SUBMIT_REVIEW_LIST, {discussSubmitId})
const {data: commontList, fetchData: commonFetch} = usePage(COMMENT_LIST, {id, type: 1})
const {data: disDetail} = useRequest(DISCUSS_DETAIL, {discussId})
const {data: disDetail} = useRequest(DISCUSS_DETAIL, {id})
const fileList = ref([])
const commentSubmitFileList = ref([])
const state = reactive({
textarea1: "",
textarealength: 0,
textarea2: "",
textarealength2: 0,
const disComment = ref({
content: '',
})
const replayComment = ref({
placeholder: '',
rId:''
});
const {
textarea1,
textarealength,
textarea2,
textarealength2,
placeholder
} = toRefs(state)
const textareaInput = (e) => {
state.textarea1 = e;
state.textarealength = e.length;
};
const textareaInputdown = (e) => {
state.textarea2 = e;
state.textarealength2 = e.length;
};
content: '',
pid: ''
})
function removeImg(i) {
fileList.value.splice(i, 1)
@@ -263,34 +240,46 @@ function removeCommentImg() {
commentSubmitFileList.value.splice(i, 1)
}
//todo 帖子是否点赞收藏
function like(discussSubmitId) {
data.value.isLike ? (data.value.discussLikeCount -= 1) : (data.value.discussLikeCount += 1)
data.value.isLike = !data.value.isLike
request(DISCUSS_LIKE, {discussSubmitId})
//todo 帖子和评论 返回是否点赞和收藏
function like() {
disDetail.value.praised ? (disDetail.value.praiseNum -= 1) : (disDetail.value.praiseNum += 1)
disDetail.value.praised = !disDetail.value.praised
request(COMMENT_PRAISE, {targetId: disDetail.value.discussId, type: 5})
}
function collection(discussSubmitId) {
data.value.isCollection ? (data.value.discussCollectionCount -= 1) : (data.value.discussCollectionCount += 1)
data.value.isCollection = !data.value.isCollection
request(DISCUSS_COLLECTION, {discussSubmitId})
function collection() {
disDetail.value.collected ? (disDetail.value.collectionNum -= 1) : (disDetail.value.collectionNum += 1)
disDetail.value.collected = !disDetail.value.collected
request(COMMENT_COLLECTION, {targetId: disDetail.value.discussId, type: 6})
}
function commentLike(obj) {
obj.isLike ? (obj.discussLikeCount -= 1) : (obj.discussLikeCount += 1)
obj.isLike = !obj.isLike
const discussSubmitId = obj.discussSubmitId
request(DISCUSS_LIKE, {discussSubmitId})
obj.praised ? (obj.praiseNum -= 1) : (obj.praiseNum += 1)
obj.praised = !obj.praised
request(COMMENT_PRAISE, {targetId: obj.id, type: 5})
}
function commentComment(obj) {
state.placeholder = '@ '+obj.stuName
state.rId = obj.discussSubmitId
replayComment.value.placeholder = '@ ' + obj.userName
replayComment.value.pid = obj.id
}
function submitComment() {
request(COMMENT_ADD, {targetId: disDetail.value.discussId, content: disComment.value.content, type: 1}).then(() => {
commonFetch()
})
}
function submitReplayComment() {
request(COMMENT_ADD, {
targetId: disDetail.value.discussId,
content: replayComment.value.content,
type: 2,
pid: replayComment.value.pid
}).then(() => {
commonFetch()
})
}
</script>
@@ -378,7 +367,6 @@ function submitComment() {
.line {
display: flex;
margin: 47px 45px 0 75px;
max-width: 1810px;
height: 50px;
background: #f9f9f9;
position: relative;