|
|
|
|
@ -147,12 +147,12 @@ |
|
|
|
|
:class="{active: item.id == active}" |
|
|
|
|
@click="tabChange(item)">{{ item.name }}</a> |
|
|
|
|
</div> |
|
|
|
|
<div class="flex"> |
|
|
|
|
<div class="tab-content"> |
|
|
|
|
<template v-if="active === 1"> |
|
|
|
|
<el-card shadow="hover" |
|
|
|
|
class="m-t-20 m-b-20"> |
|
|
|
|
<div class="page"> |
|
|
|
|
<div v-html="briefIntroduction"></div> |
|
|
|
|
</el-card> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<template v-if="active === 2"> |
|
|
|
|
<div class="page"> |
|
|
|
|
@ -244,7 +244,7 @@ |
|
|
|
|
<span class="name">{{ item.createUsername }}</span> |
|
|
|
|
发表于 {{ item.createTime }} |
|
|
|
|
</h6> |
|
|
|
|
<div class="des" |
|
|
|
|
<div class="m-t-8" |
|
|
|
|
v-html="item.content"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="action"> |
|
|
|
|
@ -253,11 +253,14 @@ |
|
|
|
|
<i v-if="deleteIdentity || item.currentAccountId == item.createAccountId" |
|
|
|
|
class="icon el-icon-delete" |
|
|
|
|
@click="delComment(item)"></i> |
|
|
|
|
<img v-if="item.isLike" |
|
|
|
|
class="icon" |
|
|
|
|
|
|
|
|
|
<template v-if="item.isLike"> |
|
|
|
|
<img class="icon" |
|
|
|
|
src="@/assets/img/like-up.png" |
|
|
|
|
alt="" |
|
|
|
|
@click="like(item)"> |
|
|
|
|
{{ item.likeCount }} |
|
|
|
|
</template> |
|
|
|
|
<img v-else |
|
|
|
|
class="icon" |
|
|
|
|
src="@/assets/img/like.png" |
|
|
|
|
@ -271,7 +274,7 @@ |
|
|
|
|
v-model="item.replyContent" |
|
|
|
|
:toTop="false" |
|
|
|
|
:height="150" /> |
|
|
|
|
<div class="m-t-10 text-right"> |
|
|
|
|
<div class="m-v-10 text-right"> |
|
|
|
|
<el-button type="primary" |
|
|
|
|
size="mini" |
|
|
|
|
@click="submitComment(item)">提交</el-button> |
|
|
|
|
@ -288,8 +291,13 @@ |
|
|
|
|
alt=""> |
|
|
|
|
<div class="texts"> |
|
|
|
|
<div class="name">{{reply.createUsername}}</div> |
|
|
|
|
<div class="des" |
|
|
|
|
v-html="reply.content"></div> |
|
|
|
|
<div class="flex m-v-8"> |
|
|
|
|
<template v-if="reply.showReplyName"> |
|
|
|
|
回复 |
|
|
|
|
<span class="reply-name">@{{ reply.replyUsername }}：</span> |
|
|
|
|
</template> |
|
|
|
|
<div v-html="reply.content"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="date">{{reply.createTime}}</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="action"> |
|
|
|
|
@ -298,11 +306,13 @@ |
|
|
|
|
<i v-if="deleteIdentity || reply.currentAccountId == reply.createAccountId" |
|
|
|
|
class="icon el-icon-delete" |
|
|
|
|
@click="delComment(reply)"></i> |
|
|
|
|
<img v-if="reply.isLike" |
|
|
|
|
class="icon" |
|
|
|
|
<template v-if="reply.isLike"> |
|
|
|
|
<img class="icon" |
|
|
|
|
src="@/assets/img/like-up.png" |
|
|
|
|
alt="" |
|
|
|
|
@click="like(reply)"> |
|
|
|
|
{{ reply.likeCount }} |
|
|
|
|
</template> |
|
|
|
|
<img v-else |
|
|
|
|
class="icon" |
|
|
|
|
src="@/assets/img/like.png" |
|
|
|
|
@ -316,7 +326,7 @@ |
|
|
|
|
v-model="reply.replyContent" |
|
|
|
|
:toTop="false" |
|
|
|
|
:height="150" /> |
|
|
|
|
<div class="m-t-10 text-right"> |
|
|
|
|
<div class="p-b-10 m-t-10 text-right"> |
|
|
|
|
<el-button type="primary" |
|
|
|
|
size="mini" |
|
|
|
|
@click="submitComment(item, reply)">提交</el-button> |
|
|
|
|
@ -324,13 +334,39 @@ |
|
|
|
|
</div> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div v-if="item.getCommentReplyNum" |
|
|
|
|
class="toggle"><span @click="item.showChildren = !item.showChildren">{{item.showChildren ? '收起所有回复' : `查看所有${item.getCommentReplyNum}条回复`}} <i class="el-icon-arrow-down"></i></span></div> |
|
|
|
|
<div v-if="item.children" |
|
|
|
|
class="toggle"><span @click="item.showChildren = !item.showChildren">{{item.showChildren ? '收起所有回复' : `查看所有${item.children.length}条回复`}} <i class="el-icon-arrow-down"></i></span></div> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
<div class="rank"> |
|
|
|
|
<el-select style="width: 100%" |
|
|
|
|
v-model="archProject" |
|
|
|
|
placeholder="请选择" |
|
|
|
|
@change="getMaximumScore"> |
|
|
|
|
<el-option v-for="(item, i) in progressList" |
|
|
|
|
:key="i" |
|
|
|
|
:label="item.projectName" |
|
|
|
|
:value="item.projectId"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
<div v-if="maximumScores.length" |
|
|
|
|
class="arches"> |
|
|
|
|
<div v-for="(item, i) in maximumScores" |
|
|
|
|
:key="i" |
|
|
|
|
class="line"> |
|
|
|
|
<div> |
|
|
|
|
<img :src="item.userAvatars" |
|
|
|
|
alt="" |
|
|
|
|
class="avatar"> |
|
|
|
|
<span class="name">{{ item.userName }}</span> |
|
|
|
|
</div> |
|
|
|
|
<span class="point">{{ item.highestScore }}分</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<el-dialog title="请选择项目" |
|
|
|
|
v-loading="loading" |
|
|
|
|
@ -470,7 +506,9 @@ export default { |
|
|
|
|
comments: [], |
|
|
|
|
comment: '', |
|
|
|
|
deleteIdentity: false, |
|
|
|
|
archProject: '' |
|
|
|
|
archProject: '', |
|
|
|
|
curReplyId: '', |
|
|
|
|
maximumScores: [] |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
|
@ -547,16 +585,27 @@ export default { |
|
|
|
|
const section = this.section === undefined ? 0 : +this.section |
|
|
|
|
const clist = this.chapterList[chapter] |
|
|
|
|
if (this.chapterList.length && clist.subsectionList && clist.subsectionList.length && !this.commentId) { |
|
|
|
|
this.preview(clist.subsectionList[section], clist.name, 1); |
|
|
|
|
// this.preview(clist.subsectionList[section], clist.name, 1); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// 获取学习进度 |
|
|
|
|
async getProgress () { |
|
|
|
|
let res = await this.$post(`${this.api.courseLearningProgress}?courseId=${this.courseId}&systemId=${this.systemIds}`); |
|
|
|
|
this.progressList = res.list |
|
|
|
|
if (res.list.length) this.archProject = res.list[0].projectId |
|
|
|
|
this.maximumScores.length || this.getMaximumScore() |
|
|
|
|
this.plan = res.plan |
|
|
|
|
this.schedule = +(res.schedule.replace('%', '')) |
|
|
|
|
}, |
|
|
|
|
// 获取最高分列表 |
|
|
|
|
async getMaximumScore () { |
|
|
|
|
let { message } = await this.$post(`${this.api.maximumPracticeScoreList}?projectId=${this.archProject}&pageNum=1&pageSize=1000`); |
|
|
|
|
const list = message.records |
|
|
|
|
list.forEach(e => { |
|
|
|
|
if (!e.userAvatars) e.userAvatars = 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png' |
|
|
|
|
}) |
|
|
|
|
this.maximumScores = list |
|
|
|
|
}, |
|
|
|
|
// 进度数字自定义 |
|
|
|
|
percentFormat (val) { |
|
|
|
|
return this.plan |
|
|
|
|
@ -623,25 +672,35 @@ export default { |
|
|
|
|
const list = res.rootComments |
|
|
|
|
this.handleComments(list) |
|
|
|
|
this.comments = list |
|
|
|
|
this.$nextTick(async () => { |
|
|
|
|
if (this.curReplyId) { |
|
|
|
|
const el = document.querySelector('#comment' + this.curReplyId) |
|
|
|
|
el && el.scrollIntoView(false) |
|
|
|
|
} |
|
|
|
|
if (this.commentId) { |
|
|
|
|
this.active = 4 |
|
|
|
|
this.$nextTick(async () => { |
|
|
|
|
document.getElementById('comment' + this.commentId).scrollIntoView(false) |
|
|
|
|
await this.$post(`${this.api.noticeRead}?isRead=1¬ifyId=${this.notifyId}`) |
|
|
|
|
}) |
|
|
|
|
const el = document.getElementById('comment' + this.commentId) |
|
|
|
|
el && el.scrollIntoView(false) |
|
|
|
|
await this.$post(`${this.api.noticeRead}?isRead=1¬ifyId=${this.notifyId}`) // 从消息通知点进来的则加载完后调已读接口 |
|
|
|
|
this.commentId = '' |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}).catch(res => { }) |
|
|
|
|
}, |
|
|
|
|
// 递归处理评论参数 |
|
|
|
|
handleComments (list, parent = {}) { |
|
|
|
|
list.forEach(e => { |
|
|
|
|
if (!e.createUserAvatars) e.createUserAvatars = 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png' |
|
|
|
|
e.getCommentReplyNum = e.children && e.children.length |
|
|
|
|
e.showChildren = false |
|
|
|
|
if (e.commentId == this.commentId) parent.showChildren = true |
|
|
|
|
if (e.commentId == this.curReplyId) e.showChildren = true |
|
|
|
|
e.showReply = false |
|
|
|
|
e.replyContent = '' |
|
|
|
|
e.children && this.handleComments(e.children, e) |
|
|
|
|
if (e.children && e.children.length && parent.children) { |
|
|
|
|
e.children.forEach(n => n.showReplyName = true) |
|
|
|
|
parent.children.push(...e.children) |
|
|
|
|
} |
|
|
|
|
e.children && this.handleComments(e.children, parent.commentId ? parent : e) |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
// 回复 |
|
|
|
|
@ -671,6 +730,7 @@ export default { |
|
|
|
|
status: row ? 2 : 1 |
|
|
|
|
}).then(res => { |
|
|
|
|
this.comment = '' |
|
|
|
|
this.curReplyId = row ? row.commentId : '' |
|
|
|
|
this.getComment() |
|
|
|
|
}).catch(res => { }) |
|
|
|
|
}, |
|
|
|
|
@ -926,7 +986,7 @@ export default { |
|
|
|
|
@import '../../../styles/page/station.scss'; |
|
|
|
|
$height: 700px; |
|
|
|
|
.page { |
|
|
|
|
margin: 12px 0; |
|
|
|
|
border-radius: 0; |
|
|
|
|
.intro { |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #333; |
|
|
|
|
@ -1218,10 +1278,36 @@ $height: 700px; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.tabs { |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
} |
|
|
|
|
.tab-content { |
|
|
|
|
width: 80%; |
|
|
|
|
} |
|
|
|
|
.rank { |
|
|
|
|
width: calc(20% - 12px); |
|
|
|
|
padding: 20px; |
|
|
|
|
margin-left: 12px; |
|
|
|
|
background-color: #fff; |
|
|
|
|
.arches { |
|
|
|
|
margin-top: 20px; |
|
|
|
|
} |
|
|
|
|
.line { |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
} |
|
|
|
|
.avatar { |
|
|
|
|
width: 35px; |
|
|
|
|
height: 35px; |
|
|
|
|
margin-right: 10px; |
|
|
|
|
} |
|
|
|
|
.point { |
|
|
|
|
font-weight: 600; |
|
|
|
|
color: #9278ff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/deep/.project-dia { |
|
|
|
|
.el-dialog__body { |
|
|
|
|
padding: 28px 32px; |
|
|
|
|
@ -1263,29 +1349,4 @@ $height: 700px; |
|
|
|
|
color: #333; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.rank { |
|
|
|
|
width: 296px; |
|
|
|
|
padding: 20px; |
|
|
|
|
margin: 12px 0 0 12px; |
|
|
|
|
background-color: #fff; |
|
|
|
|
.arches { |
|
|
|
|
margin-top: 20px; |
|
|
|
|
} |
|
|
|
|
.line { |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
} |
|
|
|
|
.avatar { |
|
|
|
|
width: 35px; |
|
|
|
|
height: 35px; |
|
|
|
|
margin-right: 10px; |
|
|
|
|
} |
|
|
|
|
.point { |
|
|
|
|
font-weight: 600; |
|
|
|
|
color: #007eff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</style> |
