|
|
@@ -1,7 +1,8 @@
|
|
|
<template>
|
|
|
<div class="discussion">
|
|
|
+ <Loading v-show="isLoad" bgColor="rgba(0, 0, 0, 0.3)"></Loading>
|
|
|
<div style="width: 100%; height: 100%; background-color: #ffffff;">
|
|
|
- <div style=" padding: 15px 15px; margin-bottom: 5px;">
|
|
|
+ <div style="padding: 15px 30px; margin-bottom: 5px;">
|
|
|
<div class="header-box">
|
|
|
<div class="searchbox">
|
|
|
<Input v-special-char search enter-button :placeholder="$t('jyzx.discuss.placeholder1')" v-model="keyword" @on-search="findTopic(true)" />
|
|
|
@@ -26,84 +27,95 @@
|
|
|
</div>
|
|
|
<div style="height: 90%;">
|
|
|
<vuescroll>
|
|
|
- <div v-for="(item, index) in discuss" :key="index" class="discuss">
|
|
|
- <div>
|
|
|
- <div class="disContent">
|
|
|
- <p class="disName" :style="{color: item.tmdid == $store.state.userInfo.sub ? '#02B35A' : '',}">
|
|
|
- {{ item.tmdname }}
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- <p class="title-box">
|
|
|
- <!-- <span style="color: #02B35A">{{ $t("jyzx.common.theme") }}：</span> -->
|
|
|
- {{ item.title }}
|
|
|
- </p>
|
|
|
+ <div>
|
|
|
+ <div v-for="(item, index) in discuss" :key="index" class="discuss">
|
|
|
<div>
|
|
|
- <!-- <span style="color: #2d8cf0">{{ $t("jyzx.common.content") }}：</span> -->
|
|
|
- <span v-html="item.comment"></span>
|
|
|
- </div>
|
|
|
- <div class="disAction">
|
|
|
- <div>
|
|
|
- <span :style="{color: activeIn === index ? '#02B35A' : ''}" @click="openDisc(index, item)">
|
|
|
- <Icon custom="iconfont icon-pinglun" size="17" class="tabIcon1" />
|
|
|
- 回复
|
|
|
- {{ item.replyCount ? item.replyCount : '' }}
|
|
|
- </span>
|
|
|
- <span style="margin-left: 20px" v-if="item.tmdid == $store.state.userInfo.sub" @click="deleteTopic(item, index)">
|
|
|
- <Icon custom="iconfont icon-shanchu" size="17" class="tabIcon1" />
|
|
|
- {{ $t("jyzx.common.delete") }}
|
|
|
- </span>
|
|
|
- <span style="margin-left: 20px" v-show="item.tmdid != $store.state.userInfo.sub">
|
|
|
- <Icon custom="iconfont icon-guzhangtousu" size="17" class="tabIcon1" />
|
|
|
- {{ $t("jyzx.common.report") }}
|
|
|
+ <div class="disContent">
|
|
|
+ <span class="disName" :style="{color: item.tmdid == $store.state.userInfo.sub ? '#02B35A' : '',}">
|
|
|
+ {{ item.tmdname }}
|
|
|
</span>
|
|
|
+ <span class="tag-style" style="border-color: #6b6ba9;color: #6b6ba9;" v-show="item.identity">老师</span>
|
|
|
</div>
|
|
|
- <p>{{ item.time | formatDate }}</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 回复框 -->
|
|
|
- <div class="replyDisc" v-if="activeIn === index">
|
|
|
- <Input v-special-char v-model="replyDis" type="textarea" :autosize="{ minRows: 2, maxRows: 5 }" placeholder="回复该话题"></Input>
|
|
|
- <div>
|
|
|
- <Button type="primary" @click="replyTopic(item)">回复</Button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 别人的留言 -->
|
|
|
- <div v-if="replies.length && activeIn === index" class="disChild">
|
|
|
- <div v-for="(child, no) in replies" :key="no">
|
|
|
- <div class="disContent">
|
|
|
- <p class="disName" :style="{color:child.tmdid === $store.state.userInfo.sub ? '#02B35A' : '',}">
|
|
|
- {{ child.tmdname }}
|
|
|
- </p>
|
|
|
+ <p class="title-box">
|
|
|
+ <!-- <span style="color: #02B35A">{{ $t("jyzx.common.theme") }}：</span> -->
|
|
|
+ {{ item.title }}
|
|
|
+ </p>
|
|
|
+ <div>
|
|
|
+ <!-- <span style="color: #2d8cf0">{{ $t("jyzx.common.content") }}：</span> -->
|
|
|
+ <span v-html="item.comment"></span>
|
|
|
</div>
|
|
|
- <p v-html="child.comment"></p>
|
|
|
<div class="disAction">
|
|
|
<div>
|
|
|
- <span @click="likeTopic(child, no)">
|
|
|
- <Icon type="ios-heart" color="#ef2a2a" v-show="child.likeit" />
|
|
|
- <Icon type="ios-heart-outline" v-show="!child.likeit" />
|
|
|
- 点赞
|
|
|
- {{ child.likes.length ? child.likes.length : '' }}
|
|
|
+ <span v-if="item.tmdid == $store.state.userInfo.sub" @click="editTopic(item)">
|
|
|
+ <Icon custom="iconfont icon-bianji" size="17" />
|
|
|
+ 编辑
|
|
|
+ </span>
|
|
|
+ <span style="margin-left: 20px" :style="{color: activeIn === index ? '#02B35A' : ''}" @click="openDisc(index, item)">
|
|
|
+ <Icon custom="iconfont icon-pinglun" size="17" />
|
|
|
+ 回复
|
|
|
+ {{ item.replyCount ? item.replyCount : '' }}
|
|
|
</span>
|
|
|
- <span style="margin-left: 20px" v-if="child.tmdid === $store.state.userInfo.sub" @click="deleteReply(child, no)">
|
|
|
- <Icon custom="iconfont icon-shanchu" size="17" class="tabIcon1" />
|
|
|
+ <span style="margin-left: 20px" class="delete-icon" v-if="item.tmdid == $store.state.userInfo.sub" @click="deleteTopic(item, index)">
|
|
|
+ <Icon custom="iconfont icon-shanchu" size="17" />
|
|
|
{{ $t("jyzx.common.delete") }}
|
|
|
</span>
|
|
|
- <span style="margin-left: 20px" v-show="child.tmdid != $store.state.userInfo.sub">
|
|
|
- <Icon custom="iconfont icon-guzhangtousu" size="17" class="tabIcon1" />
|
|
|
+ <span style="margin-left: 20px" v-show="item.tmdid != $store.state.userInfo.sub">
|
|
|
+ <Icon custom="iconfont icon-guzhangtousu" size="17" />
|
|
|
{{ $t("jyzx.common.report") }}
|
|
|
</span>
|
|
|
</div>
|
|
|
- <p>{{ child.time | formatDate }}</p>
|
|
|
+ <p>{{ item.time | formatDate }}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 回复框 -->
|
|
|
+ <div class="replyDisc" v-if="activeIn === index">
|
|
|
+ <Input v-special-char v-model="replyDis" type="textarea" :maxlength="item.wordCount" :autosize="{ minRows: 2, maxRows: 5 }" placeholder="回复该话题"></Input>
|
|
|
+ <div>
|
|
|
+ <Button type="primary" @click="replyTopic(item)">回复</Button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 别人的留言 -->
|
|
|
+ <div v-if="replies.length && activeIn === index" class="disChild">
|
|
|
+ <div v-for="(child, no) in replies" :key="no">
|
|
|
+ <div class="disContent">
|
|
|
+ <span class="disName" :style="{color:child.tmdid === $store.state.userInfo.sub ? '#02B35A' : '',}">
|
|
|
+ {{ child.tmdname }}
|
|
|
+ </span>
|
|
|
+ <span class="tag-style" style="border-color: #6b6ba9;color: #6b6ba9;" v-show="child.identity">老师</span>
|
|
|
+ </div>
|
|
|
+ <p v-html="child.comment"></p>
|
|
|
+ <div class="disAction">
|
|
|
+ <div>
|
|
|
+ <span @click="likeTopic(child, no)">
|
|
|
+ <Icon custom="iconfont icon-dianzan" size="17" color="#ff621a" v-show="child.likeit" />
|
|
|
+ <Icon custom="iconfont icon-dianzan1" size="17" v-show="!child.likeit" />
|
|
|
+ 点赞
|
|
|
+ {{ child.likes.length ? child.likes.length : '' }}
|
|
|
+ </span>
|
|
|
+ <span style="margin-left: 20px" class="delete-icon" v-if="child.tmdid === $store.state.userInfo.sub" @click="deleteReply(child, no)">
|
|
|
+ <Icon custom="iconfont icon-shanchu" size="17" />
|
|
|
+ {{ $t("jyzx.common.delete") }}
|
|
|
+ </span>
|
|
|
+ <span style="margin-left: 20px" v-show="child.tmdid != $store.state.userInfo.sub">
|
|
|
+ <Icon custom="iconfont icon-guzhangtousu" size="17" />
|
|
|
+ {{ $t("jyzx.common.report") }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <p>{{ child.time | formatDate }}</p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div v-if="!discuss.length" style="font-size: 20px; text-align: center; padding-top: 20px;">
|
|
|
+ 暂无讨论话题
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</vuescroll>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <Modal v-model="topicShow" width="50%" class="add-topic" title="发布话题" @on-ok="addTopic">
|
|
|
+ <Modal v-model="topicShow" width="50%" class="add-topic" :title="editId ? '编辑话题' : '发布话题'" @on-ok="addTopic" @on-cancel="cancelTopic">
|
|
|
<Input v-special-char v-model="topicTitle" :placeholder="$t('jyzx.discuss.placeholder2')"></Input>
|
|
|
- <div id="releaseBox" style="height: 200px"></div>
|
|
|
+ <div id="releaseBox" style="height: 340px;"></div>
|
|
|
</Modal>
|
|
|
<Modal v-model="isReport" :title="$t('jyzx.common.report')">
|
|
|
<p>{{ $t("jyzx.common.message") }}</p>
|
|
|
@@ -125,6 +137,7 @@ export default {
|
|
|
return {
|
|
|
MyNo: "14", //接收NavBar 選定的那一頁icon標示
|
|
|
MyName: "",
|
|
|
+ isLoad: false,
|
|
|
showType: {
|
|
|
name: this.$t("jyzx.discuss.allTopic"),
|
|
|
value: 0
|
|
|
@@ -133,7 +146,6 @@ export default {
|
|
|
discuss: [],
|
|
|
activeIn: -1, //-1：没有点击回复
|
|
|
replyDis: "", //回复框内容
|
|
|
- replyStatus: false,
|
|
|
replies: [],
|
|
|
isReport: false,
|
|
|
checkReport: [],
|
|
|
@@ -142,21 +154,23 @@ export default {
|
|
|
topicShow: false,
|
|
|
topicTitle: '',
|
|
|
stemContent: "",
|
|
|
+ stemEditor: null,
|
|
|
+ editId: '', //编辑id
|
|
|
}
|
|
|
},
|
|
|
mounted () {
|
|
|
this.MyName = this.$t("studentWeb.type.discussionBoard")
|
|
|
this.$emit("onNavNo", this.MyNo)
|
|
|
this.$emit("onNavName", this.MyName)
|
|
|
- let stemEditor = new E("#releaseBox")
|
|
|
- stemEditor.config.onchange = (html) => {
|
|
|
+ this.stemEditor = new E("#releaseBox")
|
|
|
+ this.stemEditor.config.onchange = (html) => {
|
|
|
this.stemContent = html
|
|
|
}
|
|
|
- stemEditor.config.uploadImgShowBase64 = true
|
|
|
- stemEditor.config.zIndex = 500
|
|
|
- // stemEditor.config.height = 300
|
|
|
- this.$editorTools.initMyEditor(stemEditor, this)
|
|
|
- stemEditor.create()
|
|
|
+ this.stemEditor.config.uploadImgShowBase64 = true
|
|
|
+ this.stemEditor.config.zIndex = 500
|
|
|
+ this.$editorTools.initMyEditor(this.stemEditor, this)
|
|
|
+ this.stemEditor.create()
|
|
|
+ document.getElementsByClassName("w-e-text-container")[0].style.height = '300px'
|
|
|
this.findTopic()
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -176,7 +190,9 @@ export default {
|
|
|
methods: {
|
|
|
// 话题列表
|
|
|
findTopic(search) {
|
|
|
+ this.isLoad = true
|
|
|
this.discuss = []
|
|
|
+ this.activeIn = -1
|
|
|
let param = {
|
|
|
source: 'course',
|
|
|
comid: this.getNowCourse.id,
|
|
|
@@ -194,7 +210,20 @@ export default {
|
|
|
}
|
|
|
this.$api.studentWeb.findTopic(param).then(res => {
|
|
|
if(res.length) {
|
|
|
- this.discuss = res
|
|
|
+ res.forEach(item => {
|
|
|
+ // 返回的课程的所有话题（未区分名单）
|
|
|
+ // 先前端根据tmdid筛选出当前课程的老师，其他老师不显示
|
|
|
+ if(this.getNowCourse.scope === 'school') {
|
|
|
+ if(item.tmdid === this.getNowCourse.roster.teacherId || item.userType === 'student') {
|
|
|
+ if(item.userType === 'tmdid') item.identity = 'teacher'
|
|
|
+ this.discuss.push(item)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if(item.tmdid === this.getNowCourse.creatorId) item.identity = 'teacher'
|
|
|
+ this.discuss.push(item)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.isLoad = false
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
@@ -206,7 +235,7 @@ export default {
|
|
|
debate: {
|
|
|
// 个人课程传课程创建者
|
|
|
code: this.getNowCourse.scope === 'school' ? this.getNowCourse.school : this.getNowCourse.creatorId,
|
|
|
- id: '', //编辑传id
|
|
|
+ id: this.editId, //编辑传id
|
|
|
title: this.topicTitle,
|
|
|
userType: this.$store.state.userInfo.scope === 'student' ? 'student' : 'tmdid',
|
|
|
tmdid: this.$store.state.userInfo.sub,
|
|
|
@@ -221,9 +250,16 @@ export default {
|
|
|
}
|
|
|
this.$api.studentWeb.addTopic(param).then(res => {
|
|
|
if(res.debate) {
|
|
|
- this.$Message.success("发布成功")
|
|
|
+ this.$Message.success(this.editId ? '编辑成功' : "发布成功")
|
|
|
this.topicShow = false
|
|
|
- this.discuss.push(res.debate)
|
|
|
+ if(this.editId) {
|
|
|
+ let editContent = this.discuss.findIndex(item => {
|
|
|
+ return item.id === this.editId
|
|
|
+ })
|
|
|
+ res.debate.replyCount = this.discuss[editContent].replyCount
|
|
|
+ this.discuss.splice(editContent, 1)
|
|
|
+ }
|
|
|
+ this.discuss.unshift(res.debate)
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
@@ -261,6 +297,10 @@ export default {
|
|
|
let isLike = item.likes.find(likes => {
|
|
|
return likes.tmdid === this.$store.state.userInfo.sub
|
|
|
})
|
|
|
+
|
|
|
+ if(this.getNowCourse.scope === 'school' && item.userType === 'tmdid' || item.tmdid === this.getNowCourse.creatorId) {
|
|
|
+ item.identity = 'teacher'
|
|
|
+ }
|
|
|
item.likeit = isLike ? true : false
|
|
|
this.replies.push(item)
|
|
|
})
|
|
|
@@ -271,7 +311,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
// 回复话题
|
|
|
- replyTopic(content) {
|
|
|
+ replyTopic(content, index) {
|
|
|
let param = {
|
|
|
debateId: content.id,
|
|
|
debateCode: this.getNowCourse.scope === 'school' ? this.getNowCourse.school : this.getNowCourse.creatorId,
|
|
|
@@ -296,7 +336,8 @@ export default {
|
|
|
if(res.reply) {
|
|
|
this.$Message.success("回复成功")
|
|
|
this.replyDis = ''
|
|
|
- this.replies.push(res.reply)
|
|
|
+ this.replies.unshift(res.reply)
|
|
|
+ this.discuss[index].replyCount++
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
@@ -327,7 +368,7 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
// 删除回复
|
|
|
- deleteReply(content, index) {
|
|
|
+ deleteReply(content, childindex, index) {
|
|
|
this.$Modal.confirm({
|
|
|
title: "删除回复",
|
|
|
content: `确认删除这条评论吗？`,
|
|
|
@@ -341,7 +382,8 @@ export default {
|
|
|
this.$api.studentWeb.replyTopic(param).then(res => {
|
|
|
if(!res.status) {
|
|
|
this.$Message.success("删除成功")
|
|
|
- this.replies.splice(index, 1)
|
|
|
+ this.replies.splice(childindex, 1)
|
|
|
+ this.discuss[index].replyCount === 1 ? this.discuss[index].replyCount = 0 : this.discuss[index].replyCount--
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
@@ -362,6 +404,20 @@ export default {
|
|
|
}
|
|
|
this.findTopic(true)
|
|
|
},
|
|
|
+ editTopic(content) {
|
|
|
+ this.topicTitle = content.title
|
|
|
+ this.stemEditor.txt.html(content.comment)
|
|
|
+ // this.stemContent = content.comment
|
|
|
+ this.topicShow = true
|
|
|
+ this.editId = content.id
|
|
|
+ },
|
|
|
+ cancelTopic() {
|
|
|
+ if(this.editId) {
|
|
|
+ this.topicTitle = ''
|
|
|
+ this.stemEditor.txt.html('')
|
|
|
+ this.editId = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
//时间格式化处理
|
|
|
dateFormat(timestamp) {
|
|
|
var date = new Date(timestamp)
|
|
|
@@ -390,9 +446,6 @@ export default {
|
|
|
justify-content: space-between;
|
|
|
.searchbox {
|
|
|
width: 25%;
|
|
|
- // padding: 0% 2%;
|
|
|
- // padding-top: 2px;
|
|
|
- // display: inline-block;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -431,6 +484,10 @@ export default {
|
|
|
.disAction {
|
|
|
margin-top: 5px;
|
|
|
|
|
|
+ .delete-icon:hover {
|
|
|
+ color: rgb(226, 17, 17);
|
|
|
+ }
|
|
|
+
|
|
|
& > p:last-child {
|
|
|
color: #878787;
|
|
|
}
|
|
|
@@ -457,7 +514,7 @@ export default {
|
|
|
padding: 10px 0 10px 5px;
|
|
|
|
|
|
& > div {
|
|
|
- padding: 2px 10px 5px;
|
|
|
+ padding: 3px 0 7px 10px;
|
|
|
|
|
|
&:not(:last-child) {
|
|
|
border-bottom: 1px solid #ffffff;
|
|
|
@@ -500,4 +557,46 @@ export default {
|
|
|
text-align: right;
|
|
|
}
|
|
|
}
|
|
|
+.w-e-text-container {
|
|
|
+ height: 300px !important;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+.discussion {
|
|
|
+ .header-box {
|
|
|
+ .ivu-input-with-search:hover,
|
|
|
+ .ivu-input-search,
|
|
|
+ .ivu-input-search:hover{
|
|
|
+ background: #02B35A !important;
|
|
|
+ border-color: #02B35A !important;
|
|
|
+ }
|
|
|
+ .ivu-input:hover,
|
|
|
+ .ivu-input:focus {
|
|
|
+ border-color: #02B35A !important;
|
|
|
+ }
|
|
|
+ .ivu-btn:hover {
|
|
|
+ color: #02B35A;
|
|
|
+ border-color: #02B35A;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .add-topic{
|
|
|
+ .ivu-btn-primary{
|
|
|
+ background-color: #02B35A;
|
|
|
+ border-color: #02B35A;
|
|
|
+ }
|
|
|
+ .ivu-btn-text:hover{
|
|
|
+ color: #02B35A;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-box,
|
|
|
+ .add-topic,
|
|
|
+ .replyDisc {
|
|
|
+ .ivu-input:hover,
|
|
|
+ .ivu-input:focus {
|
|
|
+ border-color: #02B35A !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
