mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-14 21:36:42 +08:00
Merge branch 'stat' of https://codeup.aliyun.com/6265f483e4166464dc2f9c14/boeu/portal into stat
This commit is contained in:
189
src/components/Portal/commentAuthor.vue
Normal file
189
src/components/Portal/commentAuthor.vue
Normal file
@@ -0,0 +1,189 @@
|
|||||||
|
<template>
|
||||||
|
<div class="item-author">
|
||||||
|
<el-tooltip :content="userInfo" placement="top" effect="light">
|
||||||
|
<div style="width:40px;height:40px;" @click="toHome()">
|
||||||
|
<el-avatar :size="40" shape="circle" :src="userAvatar" v-if="userAvatar"></el-avatar>
|
||||||
|
<div v-else class="uavatar">
|
||||||
|
<div v-if="sex == null" style="border-radius: 50%;width: 40px;height: 40px;"></div>
|
||||||
|
<div v-else>
|
||||||
|
<div class="mravat" v-if="sex === 1 "><img style="width:40px;height:40px;" src="../../../public/images/Avatarman.png" alt=""></div>
|
||||||
|
<div class="mravat" v-else><img style="width:40px;height:40px;" src="../../../public/images/Avatarwoman.png" alt=""></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-tooltip>
|
||||||
|
|
||||||
|
<div class="author-right-infoName" v-if="!onlyAvatar" style="padding-left: 14px;font-size: 14px;">
|
||||||
|
<div>
|
||||||
|
<span style="color: #333333;font-weight: 400;font-size: 16px;">{{userName}}</span>
|
||||||
|
<el-tooltip :content="usersign" placement="top" effect="light" :disabled="usersign.length<10">
|
||||||
|
<span class="autname">{{handleInfo(usersign)}}</span>
|
||||||
|
</el-tooltip>
|
||||||
|
<!-- <span class="author-text" v-if="userInfo && userInfo!=''">({{userInfo}})</span> -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import {cutOrgNamePath} from "@/utils/tools.js";
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
avatar:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
width:{
|
||||||
|
type:String,
|
||||||
|
default:'200px'
|
||||||
|
},
|
||||||
|
sex:{
|
||||||
|
type:Number,
|
||||||
|
},
|
||||||
|
name:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
sign:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
|
||||||
|
aid:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
info:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
onlyAvatar:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
baseUrl:process.env.VUE_APP_FILE_BASE_URL,
|
||||||
|
userAvatar:'',
|
||||||
|
userName:'',
|
||||||
|
userInfo:'',
|
||||||
|
usersex:null,
|
||||||
|
usersign:'',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
// this.userAvatar=require("@/assets/images/user/default.png");
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.userName=this.name;
|
||||||
|
if(this.avatar && this.avatar!=''){
|
||||||
|
this.userAvatar=this.avatar;
|
||||||
|
}
|
||||||
|
this.userInfo=cutOrgNamePath(this.info);
|
||||||
|
this.usersex = this.sex;
|
||||||
|
this.usersign = this.sign;
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
handleInfo(info) {
|
||||||
|
let sign = '';
|
||||||
|
if(info.length > 10) {
|
||||||
|
sign = info.substring(0,10) + '...';
|
||||||
|
} else {
|
||||||
|
sign = info;
|
||||||
|
}
|
||||||
|
return sign;
|
||||||
|
},
|
||||||
|
toHome() {
|
||||||
|
// ,query:{id:item.objId || item.id}
|
||||||
|
if(this.aid){
|
||||||
|
this.$router.push({path:this.$xpage.getHomePath(this.aid)})
|
||||||
|
}else{
|
||||||
|
this.$message.error("参数错误");
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
name(newVal,oldVal){
|
||||||
|
this.userName=newVal;
|
||||||
|
},
|
||||||
|
sign(newVal,oldVal){
|
||||||
|
this.usersign=newVal;
|
||||||
|
},
|
||||||
|
avatar(newVal,oldVal){
|
||||||
|
if(newVal){
|
||||||
|
this.userAvatar=this.baseUrl+newVal;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
aid(newVal,oldVal){
|
||||||
|
if(newVal){
|
||||||
|
this.aid=newVal;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
sex(newVal,oldVal){
|
||||||
|
this.usersex=newVal;
|
||||||
|
},
|
||||||
|
info(newVal,oldVal){
|
||||||
|
if(newVal){
|
||||||
|
this.userInfo=cutOrgNamePath(newVal);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
.mravat{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.author-right-infoName{
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
.autname{
|
||||||
|
color: #666666;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 25px;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-author{
|
||||||
|
// font-size: 0.9em;
|
||||||
|
line-height: 18px;
|
||||||
|
display: flex;
|
||||||
|
.author-text{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
font-weight: 300;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
.uavatar{
|
||||||
|
// border: 1px solid #73adfe;
|
||||||
|
// width: 28px;
|
||||||
|
// height: 28px;
|
||||||
|
// background: #d9e9ff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
.uavatar-text{
|
||||||
|
transform: scale(0.8);
|
||||||
|
font-size: 12px;
|
||||||
|
color: #73adfe;
|
||||||
|
}
|
||||||
|
img{
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -118,9 +118,10 @@
|
|||||||
<div class="comment-author">
|
<div class="comment-author">
|
||||||
<authorInfo :aid="reply.sysCreateAid" :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo" :sign="reply.sign"></authorInfo>
|
<authorInfo :aid="reply.sysCreateAid" :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo" :sign="reply.sign"></authorInfo>
|
||||||
<span style="margin-left: 10px;color: #8590A6;font-size:14px; ">
|
<span style="margin-left: 10px;color: #8590A6;font-size:14px; ">
|
||||||
<svg-icon style="font-size: 10px;margin-right: 0;" icon-class="triangle"></svg-icon>
|
<!-- <svg-icon style="font-size: 10px;margin-right: 0;" icon-class="triangle"></svg-icon> -->
|
||||||
|
<span>回复了</span>
|
||||||
</span>
|
</span>
|
||||||
<span style="margin-left: 6px;font-size:14px;margin-top:5px" class="portal-title-tow" >{{reply.replyName || reply.toAname}}</span>
|
<span style="margin-left: 6px;font-size:14px;" class="portal-title-tow" >{{reply.replyName || reply.toAname}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="comment-body" @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
|
<div class="comment-body" @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
|
||||||
@@ -240,7 +241,7 @@
|
|||||||
import interactBar from "@/components/Portal/interactBar.vue";
|
import interactBar from "@/components/Portal/interactBar.vue";
|
||||||
import apiComment from '@/api/modules/comments.js'
|
import apiComment from '@/api/modules/comments.js'
|
||||||
import apiUser from '@/api/system/user.js'
|
import apiUser from '@/api/system/user.js'
|
||||||
import authorInfo from '@/components/Portal/artauthor.vue';
|
import authorInfo from '@/components/Portal/commentAuthor.vue';
|
||||||
// import author from '@/components/Portal/author.vue';
|
// import author from '@/components/Portal/author.vue';
|
||||||
import { mapGetters } from 'vuex';
|
import { mapGetters } from 'vuex';
|
||||||
export default {
|
export default {
|
||||||
@@ -935,6 +936,7 @@
|
|||||||
padding-left: 8px;
|
padding-left: 8px;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
word-break:break-all;
|
word-break:break-all;
|
||||||
|
letter-spacing:1px;
|
||||||
span {
|
span {
|
||||||
color: #409eff;
|
color: #409eff;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|||||||
@@ -21,6 +21,7 @@
|
|||||||
<div class="comment-body" >
|
<div class="comment-body" >
|
||||||
<div class="comment-info" @mouseover="showButtons(com.id)" @mouseout="hideButtons()">
|
<div class="comment-info" @mouseover="showButtons(com.id)" @mouseout="hideButtons()">
|
||||||
<div class="comment-content" @click="cancelReply()">
|
<div class="comment-content" @click="cancelReply()">
|
||||||
|
<span class="play-time"><img :src="`${webBaseUrl}/images/coteplay.png`" alt=""> {{ getHMS(com.playTime) }}</span>
|
||||||
<span class="portal-summary-text" style="color: #666666;" v-html="displayAll(com)"></span>
|
<span class="portal-summary-text" style="color: #666666;" v-html="displayAll(com)"></span>
|
||||||
<span v-if="com.content.length>170" @click="changeIsAll(com)">
|
<span v-if="com.content.length>170" @click="changeIsAll(com)">
|
||||||
{{com.isAll?'收起':'全文'}}
|
{{com.isAll?'收起':'全文'}}
|
||||||
@@ -30,7 +31,7 @@
|
|||||||
<showTime :time="com.sysCreateTime"></showTime>
|
<showTime :time="com.sysCreateTime"></showTime>
|
||||||
<interactBar :type="6" :shares="false" :data="com" @addAnswers="showReply(com)" :views="false" :comments="false" :answers="true"></interactBar>
|
<interactBar :type="6" :shares="false" :data="com" @addAnswers="showReply(com)" :views="false" :comments="false" :answers="true"></interactBar>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="replyInfo.parentId==com.id" class="comment-reply" style="padding-bottom: 5px;">
|
<div v-if="replyInfo.parentId==com.id" class="comment-reply" style="padding-bottom: 5px;margin-top: 20px;">
|
||||||
<div style="width:100%;display:flex;">
|
<div style="width:100%;display:flex;">
|
||||||
<div style="flex: 1;">
|
<div style="flex: 1;">
|
||||||
<el-input class="hideControl" type="textarea" show-word-limit v-model="replyInfo.content" maxlength="800" placeholder="回复内容..."></el-input>
|
<el-input class="hideControl" type="textarea" show-word-limit v-model="replyInfo.content" maxlength="800" placeholder="回复内容..."></el-input>
|
||||||
@@ -48,9 +49,10 @@
|
|||||||
<div class="comment-author">
|
<div class="comment-author">
|
||||||
<authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo" :sign="reply.sign"></authorInfo>
|
<authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo" :sign="reply.sign"></authorInfo>
|
||||||
<span style="margin-left: 10px;color: #8590A6;font-size:14px; ">
|
<span style="margin-left: 10px;color: #8590A6;font-size:14px; ">
|
||||||
<svg-icon style="font-size: 10px;margin-right: 0;" icon-class="triangle"></svg-icon>
|
<!-- <svg-icon style="font-size: 10px;margin-right: 0;" icon-class="triangle"></svg-icon> -->
|
||||||
|
<span>回复了</span>
|
||||||
</span>
|
</span>
|
||||||
<span style="margin-left: 6px;font-size:14px;margin-top:5px" class="portal-title-tow" >{{reply.replyName || reply.toAname}}</span>
|
<span style="margin-left: 6px;font-size:14px;" class="portal-title-tow" >{{reply.replyName || reply.toAname}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="comment-body" @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
|
<div class="comment-body" @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
|
||||||
@@ -144,8 +146,9 @@
|
|||||||
import interactBar from "@/components/Portal/interactBar.vue";
|
import interactBar from "@/components/Portal/interactBar.vue";
|
||||||
import apiComment from '@/api/modules/comments.js'
|
import apiComment from '@/api/modules/comments.js'
|
||||||
import apiUser from '@/api/system/user.js'
|
import apiUser from '@/api/system/user.js'
|
||||||
import authorInfo from '@/components/Portal/artauthor.vue';
|
import authorInfo from '@/components/Portal/commentAuthor.vue';
|
||||||
import apiNote from '@/api/phase2/note.js';
|
import apiNote from '@/api/phase2/note.js';
|
||||||
|
import {getHMS} from '@/utils/tools.js';
|
||||||
// import author from '@/components/Portal/author.vue';
|
// import author from '@/components/Portal/author.vue';
|
||||||
import { mapGetters } from 'vuex';
|
import { mapGetters } from 'vuex';
|
||||||
export default {
|
export default {
|
||||||
@@ -188,6 +191,7 @@
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
getHMS,
|
||||||
replyLoading:false,
|
replyLoading:false,
|
||||||
radio:1,
|
radio:1,
|
||||||
value:false,
|
value:false,
|
||||||
@@ -798,8 +802,9 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.comment{
|
.comment{
|
||||||
margin-top: 10px;
|
margin-top: 20px;
|
||||||
background-color: #FFFFFF;
|
background-color: #FFFFFF;
|
||||||
|
margin-bottom: 20px;
|
||||||
// border-bottom: 1px solid #dddddd;
|
// border-bottom: 1px solid #dddddd;
|
||||||
.comment-top{
|
.comment-top{
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -816,12 +821,24 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.comment-body{
|
.comment-body{
|
||||||
|
letter-spacing:1px;
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
.comment-content{
|
.comment-content{
|
||||||
padding-bottom: 0px;
|
padding-bottom: 0px;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
word-break:break-all;
|
word-break:break-all;
|
||||||
padding-left:14px;
|
padding-left:14px;
|
||||||
|
.play-time{
|
||||||
|
display: inline-block;
|
||||||
|
padding: 2px 8px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid #3379fb;
|
||||||
|
margin-right: 5px;
|
||||||
|
img{
|
||||||
|
vertical-align: top;
|
||||||
|
margin-top: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
span {
|
span {
|
||||||
color: #409eff;
|
color: #409eff;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@@ -844,6 +861,7 @@
|
|||||||
}
|
}
|
||||||
.comment-replys{
|
.comment-replys{
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.comment-last{
|
.comment-last{
|
||||||
|
|||||||
Reference in New Issue
Block a user