This commit is contained in:
daihh
2022-07-11 09:31:52 +08:00
4 changed files with 608 additions and 508 deletions

View File

@@ -36,8 +36,7 @@
class="reference-tag" class="reference-tag"
v-for="item in toUsers" v-for="item in toUsers"
:key="item.aid" :key="item.aid"
:label="item.aid">{{ item.name }}</el-radio-button :label="item.aid">{{ item.name }}</el-radio-button>
>
</el-radio-group> </el-radio-group>
</div> </div>
@@ -68,7 +67,7 @@
type="textarea" type="textarea"
class="hideControl" class="hideControl"
show-word-limit show-word-limit
v-model.trim="inputValue" v-model="inputValue"
maxlength="800" maxlength="800"
placeholder="写下您的评论(800字以内),可以@案主哦~" placeholder="写下您的评论(800字以内),可以@案主哦~"
></el-input> ></el-input>
@@ -488,7 +487,7 @@
objType:this.objType, objType:this.objType,
objId:this.objId, objId:this.objId,
parentId:'-1', parentId:'-1',
content:this.inputValue, content:this.inputValue.trim(),
clevel:1, clevel:1,
toAid:'', toAid:'',
toAname:'', toAname:'',
@@ -554,6 +553,7 @@
this.replyInfo.parentId=''; this.replyInfo.parentId='';
}, },
submitReply(comment){ submitReply(comment){
this.replyInfo.content = this.replyInfo.content.trim();
if(this.replyInfo.content==''){ if(this.replyInfo.content==''){
return; return;
} }
@@ -660,6 +660,7 @@
this.replyShow=true; this.replyShow=true;
}, },
submitDlgReply(){ submitDlgReply(){
this.replyInfo.content = this.replyInfo.content.trim();
if(this.replyInfo.content==''){ if(this.replyInfo.content==''){
return; return;
} }

View File

@@ -4,7 +4,7 @@
<el-form-item label="回答内容"> <el-form-item label="回答内容">
<el-input <el-input
type="textarea" type="textarea"
v-model.trim="editData.content" v-model="editData.content"
placeholder="请输入详细描述" placeholder="请输入详细描述"
rows="8" rows="8"
minlength="1" minlength="1"
@@ -45,6 +45,7 @@
type: 'warning' type: 'warning'
}); });
} }
this.editData.content = this.editData.content.trim();
// if(this.editData.content.length<0||this.editData.content.length>255){ // if(this.editData.content.length<0||this.editData.content.length>255){
// return this.$message({ // return this.$message({
// message: '回复内容为0-800个字', // message: '回复内容为0-800个字',

View File

@@ -1,7 +1,7 @@
<template> <template>
<div id="answer-detail"> <div id="answer-detail">
<portal-header current="qa" :goSearch="4"></portal-header> <portal-header current="qa" :goSearch="4"></portal-header>
<div class="portal-content xcontent" > <div class="portal-content xcontent">
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb-nav"> <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb-nav">
<el-breadcrumb-item :to="{ path: '/qa' }">问答列表</el-breadcrumb-item> <el-breadcrumb-item :to="{ path: '/qa' }">问答列表</el-breadcrumb-item>
<el-breadcrumb-item>问答详情</el-breadcrumb-item> <el-breadcrumb-item>问答详情</el-breadcrumb-item>
@@ -10,44 +10,52 @@
<div style="flex: 1;"> <div style="flex: 1;">
<el-row v-if="noData"> <el-row v-if="noData">
<el-card :body-style="{ padding: '0px' }" class="detail"> <el-card :body-style="{ padding: '0px' }" class="detail">
<div class="title" > <div class="title">
<span class="qa-basic" :class="detailData.isResolve ? 'qa-solve' : 'qa-unSolve'"> <span class="qa-basic" :class="detailData.isResolve ? 'qa-solve' : 'qa-unSolve'">
{{ detailData.isResolve === true ? '【已解决】' : detailData.isResolve === false ? '【待解决】' : '' }} {{ detailData.isResolve === true ? '【已解决】' : detailData.isResolve === false ? '【待解决】' : '' }}
</span> </span>
{{ detailData.title }} {{ detailData.title }}
</div> </div>
<div class="label" style="display: flex;margin: 9px 0 14px 0;justify-content: space-between;align-items: center;font-size: 12px;"> <div class="label"
style="display: flex;margin: 9px 0 14px 0;justify-content: space-between;align-items: center;font-size: 12px;">
<!-- <img :src="detailData.avatar || '/temp/index/male.jpg'" /> --> <!-- <img :src="detailData.avatar || '/temp/index/male.jpg'" /> -->
<author width="24px" height="24px" :avatar="detailData.avatar" :name="detailData.name" :sex="detailData.sex"></author> <author width="24px" height="24px" :avatar="detailData.avatar" :name="detailData.name"
:sex="detailData.sex"></author>
<!-- <author :avatar="detailData.avatar" :info="detailData.orgInfo" :name="detailData.name"></author> --> <!-- <author :avatar="detailData.avatar" :info="detailData.orgInfo" :name="detailData.name"></author> -->
<time-show :time="detailData.sysCreateTime"></time-show> <time-show :time="detailData.sysCreateTime"></time-show>
</div> </div>
<div class="content"> <div class="content">
<div style="word-break:break-all;">{{ detailData.content }}</div> <div style="word-break:break-all;">{{ detailData.content }}</div>
<div v-if="detailData.images" style="margin: 10px 0px;"><el-image :src="fileUrl + detailData.images" fit="scaleDown" /></div> <div v-if="detailData.images" style="margin: 10px 0px;">
<el-image :src="fileUrl + detailData.images" fit="scaleDown" />
</div>
</div> </div>
<div class="btn-div"> <div class="btn-div">
<div class="write-btn" @click="answerShow=true"> <div class="write-btn" @click="answerShow = true">
<el-button type="text" icon="el-icon-edit">写回答</el-button> <el-button type="text" icon="el-icon-edit">写回答</el-button>
</div> </div>
<span class="answer-total">共计{{detailData.answers}}条回答</span> <span class="answer-total">共计{{ detailData.answers }}条回答</span>
<interactBar v-if="detailData.id" :type="4" :comments="false" :data="detailData" :views="false"></interactBar> <interactBar v-if="detailData.id" :type="4" :comments="false" :data="detailData" :views="false">
</interactBar>
</div> </div>
</el-card> </el-card>
<div v-if="answerShow"> <div v-if="answerShow">
<el-card :body-style="{ padding: '0px' }" style="padding: 20px;"> <el-card :body-style="{ padding: '0px' }" style="padding: 20px;">
<div> <div>
<el-input type="textarea" rows="5" placeholder="写下您的答案(800字以内),可以@提问者哦~" minlength="1" maxlength="800" v-model="content"></el-input> <el-input type="textarea" rows="5" placeholder="写下您的答案(800字以内),可以@提问者哦~" minlength="1" maxlength="800"
v-model="content"></el-input>
</div> </div>
<div style="padding-top: 10px;"> <div style="padding-top: 10px;">
<el-button type="primary" :disabled="!checked" class="dian-btn" @click="publishAnswer">发布</el-button> <el-button type="primary" :disabled="!checked" class="dian-btn" @click="publishAnswer">发布</el-button>
<!-- <el-checkbox style="margin-left:20px" v-model="checked"></el-checkbox><span style="margin-left:10px" @click="qaFormCheckedShow = true">我已阅读并遵守平台内容发布要求</span> --> <!-- <el-checkbox style="margin-left:20px" v-model="checked"></el-checkbox><span style="margin-left:10px" @click="qaFormCheckedShow = true">我已阅读并遵守平台内容发布要求</span> -->
<el-checkbox style="margin-left:20px" v-model="checked"></el-checkbox><span style="font-size:14px;color:#787878;margin-left:10px">我已阅读并遵守<span style="color:#588afc;cursor: pointer;" @click="qaFormCheckedShow = true">平台内容发布要求</span></span> <el-checkbox style="margin-left:20px" v-model="checked"></el-checkbox><span
style="font-size:14px;color:#787878;margin-left:10px">我已阅读并遵守<span
style="color:#588afc;cursor: pointer;" @click="qaFormCheckedShow = true">平台内容发布要求</span></span>
</div> </div>
</el-card> </el-card>
</div> </div>
<el-card class="box-card" v-if="answerList.length ==0&&!answerShow" :body-style="{ padding: '0px' }"> <el-card class="box-card" v-if="answerList.length == 0 && !answerShow" :body-style="{ padding: '0px' }">
<div> <div>
<div style="height:50px;margin-top: 50px;"> <div style="height:50px;margin-top: 50px;">
<img style="width:50px" src="../../../assets/images/icon/anser.png" alt="" srcset=""> <img style="width:50px" src="../../../assets/images/icon/anser.png" alt="" srcset="">
@@ -65,29 +73,48 @@
<el-button type="primary" class="dian-btn" @click="publishAnswer">发布</el-button> <el-button type="primary" class="dian-btn" @click="publishAnswer">发布</el-button>
</el-card> --> </el-card> -->
<el-card :body-style="{ padding: '0px' }" class="answer-reply-box"> <el-card :body-style="{ padding: '0px' }" class="answer-reply-box">
<div class="answer" v-for="(item, index) of answerList" :key="item.id" :style="index === answerList.length - 1 ? 'border-bottom:none;' : ''"> <div class="answer" v-for="(item, index) of answerList" :key="item.id"
:style="index === answerList.length - 1 ? 'border-bottom:none;' : ''">
<div class="answer-top"> <div class="answer-top">
<div><author :avatar="item.avatar" :name="item.sysCreateBy" :sex="item.sex"></author></div>
<div> <div>
<span v-if="detailData.isResolve&&item.isBest" style="color: #ffb30f">最佳答案</span> <author :avatar="item.avatar" :name="item.sysCreateBy" :sex="item.sex"></author>
<el-button type="primary" v-if="!detailData.isResolve && detailData.sysCreateAid == userInfo.aid" class="zuijia" @click="editAnsweBest(item)">设为最佳答案</el-button> </div>
<div>
<span v-if="detailData.isResolve && item.isBest" style="color: #ffb30f">最佳答案</span>
<el-button type="primary"
v-if="!detailData.isResolve && detailData.sysCreateAid == userInfo.aid" class="zuijia"
@click="editAnsweBest(item)">设为最佳答案</el-button>
</div> </div>
</div> </div>
<div class="answer-body"> <div class="answer-body">
<div @mouseover="showButtons(item.id)" @mouseout="hideButtons()"><!--在这一层上加事件--> <div @mouseover="showButtons(item.id)" @mouseout="hideButtons()">
<!--在这一层上加事件-->
<div class="answer-text">{{ displayAll(item) }} <div class="answer-text">{{ displayAll(item) }}
<span v-if="item.content.length>170" @click="changeIsAll(item)">{{item.isAll?'收起':'全文'}}</span> <span v-if="item.content.length > 170" @click="changeIsAll(item)">{{ item.isAll ? '收起' : '全文'
}}</span>
</div> </div>
<div class="answer-time"> <div class="answer-time">
<div>回答于 <time-show :time="item.sysCreateTime"></time-show></div> <div>回答于 <time-show :time="item.sysCreateTime"></time-show>
<div style="margin-right: 10px;"><interactBar :type="5" :comments="false" :favorites="false" :data="item" :shares="false" :views="false"></interactBar></div> </div>
<div style="margin-right: 10px;">
<interactBar :type="5" :comments="false" :favorites="false" :data="item" :shares="false"
:views="false"></interactBar>
</div>
</div> </div>
<div class="answer-boot"> <div class="answer-boot">
<div class="answer-boot-btns"> <div class="answer-boot-btns">
<div v-show="btnsShowRowId==item.id"> <div v-show="btnsShowRowId == item.id">
<a @click="showRowInput(item,{})"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a> <a @click="showRowInput(item, {})">
<a v-if="item.sysCreateAid == userInfo.aid" @click="editAnswer(item)"> <i class="el-icon-edit" style="margin-right:10px;font-size: 15px;color: #8590A6; ">编辑</i></a> <svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon>
<a v-if="item.sysCreateAid == userInfo.aid" @click="delAnswer(item)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a> <span>回复</span>
</a>
<a v-if="item.sysCreateAid == userInfo.aid" @click="editAnswer(item)"> <i
class="el-icon-edit"
style="margin-right:10px;font-size: 15px;color: #8590A6; ">编辑</i></a>
<a v-if="item.sysCreateAid == userInfo.aid" @click="delAnswer(item)">
<svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon>
<span>删除</span>
</a>
<!-- <a v-if="item.answers && item.answers.length==5" @click="showMoreReply(item)" ><svg-icon icon-class="all" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>全部回复</span></a> --> <!-- <a v-if="item.answers && item.answers.length==5" @click="showMoreReply(item)" ><svg-icon icon-class="all" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>全部回复</span></a> -->
</div> </div>
<!-- <i class="el-icon-chat-line-round" @click="showRowInput(item,{})" style="margin-right:10px;"></i> <!-- <i class="el-icon-chat-line-round" @click="showRowInput(item,{})" style="margin-right:10px;"></i>
@@ -96,54 +123,64 @@
</div> </div>
</div> </div>
<!----> <!---->
<div v-show="curParentId==item.id" class="answer-reply"> <div v-show="curParentId == item.id" class="answer-reply">
<el-input type="textarea" v-model="replyContent" show-word-limit maxlength="800" placeholder="回复内容"></el-input> <el-input type="textarea" v-model="replyContent" show-word-limit maxlength="800"
<el-button type="primary" @click="replyContentMethod(item,{})">发布回复</el-button> placeholder="回复内容"></el-input>
<el-button type="primary" @click="replyContentMethod(item, {})">发布回复</el-button>
</div> </div>
</div> </div>
<!--一级评论二级数据--> <!--一级评论二级数据-->
<div v-if="item.answers && item.answers.length!=0"> <div v-if="item.answers && item.answers.length != 0">
<div class="comment" v-for="(con,i) in item.answers" :key="i" :class="i===item.answers.length-1 ? 'comment-last' : ''"> <div class="comment" v-for="(con, i) in item.answers" :key="i"
:class="i === item.answers.length - 1 ? 'comment-last' : ''">
<div class="comment-top"> <div class="comment-top">
<div class="comment-author"> <div class="comment-author">
<author :avatar="con.avatar" :name="con.sysCreateBy" :sex="con.sex"></author> <author :avatar="con.avatar" :name="con.sysCreateBy" :sex="con.sex"></author>
<span class="comment-author-text">回复</span> <span class="comment-author-text">回复</span>
<span style="margin-left: 10px; font-size:14px">{{con.replayName}}</span> <span style="margin-left: 10px; font-size:14px">{{ con.replayName }}</span>
</div> </div>
<div class="comment-time"> <div class="comment-time">
<time-show :time="con.sysCreateTime"></time-show> <time-show :time="con.sysCreateTime"></time-show>
</div> </div>
</div> </div>
<div class="comment-body" > <div class="comment-body">
<div class="comment-info" @mouseover="showButtons(con.id)" @mouseout="hideButtons()"> <div class="comment-info" @mouseover="showButtons(con.id)" @mouseout="hideButtons()">
<div class="comment-content"> <div class="comment-content">
{{ displayAll(con) }} {{ displayAll(con) }}
<span v-if="con.content.length>170" @click="changeIsAll(con)"> <span v-if="con.content.length > 170" @click="changeIsAll(con)">
{{con.isAll?'收起':'全文'}} {{ con.isAll ? '收起' : '全文' }}
</span> </span>
</div> </div>
<div class="comment-btns"> <div class="comment-btns">
<div v-show="btnsShowRowId==con.id"> <div v-show="btnsShowRowId == con.id">
<a @click="showRowInput(con,item)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a> <a @click="showRowInput(con, item)">
<a v-if="con.sysCreateAid == userInfo.aid" @click="delAnswer(con)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a> <svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;">
</svg-icon><span>回复</span>
</a>
<a v-if="con.sysCreateAid == userInfo.aid" @click="delAnswer(con)">
<svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon>
<span>删除</span>
</a>
</div> </div>
<!-- <i class="el-icon-chat-line-round" @click="showRowInput(con,item)" style="margin-right:10px;"></i> <!-- <i class="el-icon-chat-line-round" @click="showRowInput(con,item)" style="margin-right:10px;"></i>
<i class="el-icon-edit" style="margin-right:10px;" v-if="con.sysCreateAid == userInfo.aid" @click="editAnswer(con)"></i> <i class="el-icon-edit" style="margin-right:10px;" v-if="con.sysCreateAid == userInfo.aid" @click="editAnswer(con)"></i>
<i class="el-icon-delete" v-if="detailData.sysCreateAid == userInfo.aid||con.sysCreateAid == userInfo.aid" @click="delAnswer(con)"></i> --> <i class="el-icon-delete" v-if="detailData.sysCreateAid == userInfo.aid||con.sysCreateAid == userInfo.aid" @click="delAnswer(con)"></i> -->
</div> </div>
<div class="comment-reply" v-show="curParentId==con.id"> <div class="comment-reply" v-show="curParentId == con.id">
<el-input type="textarea" v-model="replyContent" placeholder="回复内容" show-word-limit maxlength="100"></el-input> <el-input type="textarea" v-model="replyContent" placeholder="回复内容" show-word-limit
<el-button type="primary" @click="replyContentMethod(con,item)">发布回复</el-button> maxlength="100"></el-input>
<el-button type="primary" @click="replyContentMethod(con, item)">发布回复</el-button>
</div> </div>
</div> </div>
<!--三级数据--> <!--三级数据-->
<div v-if="con.answers && con.answers.length>0"> <div v-if="con.answers && con.answers.length > 0">
<div class="comment" v-for="(row,rowIdx) in con.answers" :key="rowIdx" :class="rowIdx===con.answers.length-1 ? 'comment-last' : ''"> <div class="comment" v-for="(row, rowIdx) in con.answers" :key="rowIdx"
:class="rowIdx === con.answers.length - 1 ? 'comment-last' : ''">
<div class="comment-top"> <div class="comment-top">
<div class="comment-author"> <div class="comment-author">
<author :avatar="row.avatar" :name="row.sysCreateBy" :sex="row.sex"></author> <author :avatar="row.avatar" :name="row.sysCreateBy" :sex="row.sex"></author>
<span class="comment-author-text">回复</span> <span class="comment-author-text">回复</span>
<span style="margin-left: 10px; font-size:14px">{{row.replayName}}</span> <span style="margin-left: 10px; font-size:14px">{{ row.replayName }}</span>
</div> </div>
<div class="comment-time"> <div class="comment-time">
<time-show :time="row.sysCreateTime"></time-show> <time-show :time="row.sysCreateTime"></time-show>
@@ -153,14 +190,20 @@
<div class="comment-info" @mouseover="showButtons(row.id)" @mouseout="hideButtons()"> <div class="comment-info" @mouseover="showButtons(row.id)" @mouseout="hideButtons()">
<div class="comment-content"> <div class="comment-content">
{{ displayAll(row) }} {{ displayAll(row) }}
<span v-if="row.content.length>170" @click="changeIsAll(row)"> <span v-if="row.content.length > 170" @click="changeIsAll(row)">
{{row.isAll?'收起':'全文'}} {{ row.isAll ? '收起' : '全文' }}
</span> </span>
</div> </div>
<div class="comment-btns"> <div class="comment-btns">
<div v-show="btnsShowRowId==row.id"> <div v-show="btnsShowRowId == row.id">
<a @click="showRowInput(row,con)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a> <a @click="showRowInput(row, con)">
<a v-if="row.sysCreateAid == userInfo.aid" @click="delAnswer(row)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a> <svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;">
</svg-icon><span>回复</span>
</a>
<a v-if="row.sysCreateAid == userInfo.aid" @click="delAnswer(row)">
<svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;">
</svg-icon><span>删除</span>
</a>
</div> </div>
<!-- <i class="el-icon-thumb" style="margin-right:10px;"></i> --> <!-- <i class="el-icon-thumb" style="margin-right:10px;"></i> -->
<!-- <i class="el-icon-chat-line-round" @click="showRowInput(row,con)" style="margin-right:10px;"></i> <!-- <i class="el-icon-chat-line-round" @click="showRowInput(row,con)" style="margin-right:10px;"></i>
@@ -168,16 +211,18 @@
<i class="el-icon-delete" v-if="detailData.sysCreateAid == userInfo.aid||row.sysCreateAid == userInfo.aid" @click="delAnswer(row)"></i> --> <i class="el-icon-delete" v-if="detailData.sysCreateAid == userInfo.aid||row.sysCreateAid == userInfo.aid" @click="delAnswer(row)"></i> -->
</div> </div>
</div> </div>
<div class="comment-reply" v-show="curParentId==row.id"> <div class="comment-reply" v-show="curParentId == row.id">
<el-input type="textarea" v-model="replyContent" show-word-limit maxlength="100" placeholder="回复内容"></el-input> <el-input type="textarea" v-model="replyContent" show-word-limit maxlength="100"
<el-button type="primary" @click="replyContentMethod(row,con)">发布回复</el-button> placeholder="回复内容"></el-input>
<el-button type="primary" @click="replyContentMethod(row, con)">发布回复</el-button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div><!--二级数据结束--> </div>
<!--二级数据结束-->
</div> </div>
</div> </div>
</div> </div>
@@ -185,7 +230,8 @@
</el-card> </el-card>
<div class="pagination-div"> <div class="pagination-div">
<span class="pag-text" @click="loadMore()" v-if="moreState == 1">加载更多</span> <span class="pag-text" @click="loadMore()" v-if="moreState == 1">加载更多</span>
<span class="pag-text-msg" style="font-size:14px;color: #444444;" v-else-if="moreState == 3">没有更多数据了</span> <span class="pag-text-msg" style="font-size:14px;color: #444444;"
v-else-if="moreState == 3">没有更多数据了</span>
</div> </div>
</div> </div>
</div> </div>
@@ -196,13 +242,14 @@
</div> </div>
<div style="width: 245px;margin-left: 5px;"> <div style="width: 245px;margin-left: 5px;">
<el-row> <el-row>
<div class="qa-ranking" > <div class="qa-ranking">
<div style="margin-bottom:15px;padding: 0"> <div style="margin-bottom:15px;padding: 0">
<el-button style="height: 100%;height: 37px;border-radius: 0; width: 100%;" @click="$refs.addQuestion.askQuestionDialog = true" type="primary">提问题</el-button> <el-button style="height: 100%;height: 37px;border-radius: 0; width: 100%;"
@click="$refs.addQuestion.askQuestionDialog = true" type="primary">提问题</el-button>
</div> </div>
<div :span="24" style="padding:0"> <div :span="24" style="padding:0">
<el-card class="ranking-card"> <el-card class="ranking-card">
<div slot="header" > <div slot="header">
<span style="font-size: 14px;font-weight: 600;color: #333333;">贡献排行榜</span> <span style="font-size: 14px;font-weight: 600;color: #333333;">贡献排行榜</span>
<!-- <el-radio-group v-model="anking" size="mini" style="float: right"> <!-- <el-radio-group v-model="anking" size="mini" style="float: right">
<el-radio-button label="年"></el-radio-button> <el-radio-button label="年"></el-radio-button>
@@ -212,12 +259,13 @@
</div> </div>
<div style="padding-bottom:10px"> <div style="padding-bottom:10px">
<el-row class="ranking-title bacolor" v-for="(item, index) in ankingList" :key="index" > <el-row class="ranking-title bacolor" v-for="(item, index) in ankingList" :key="index">
<el-col :span="6" style="height:34px;" > <el-col :span="6" style="height:34px;">
<img style="margin-top: 5px;" v-if="index===0" :src="`${webBaseUrl}/images/first.png`"/> <img style="margin-top: 5px;" v-if="index === 0" :src="`${webBaseUrl}/images/first.png`" />
<img style="margin-top: 5px;" v-if="index===1" :src="`${webBaseUrl}/images/second.png`"/> <img style="margin-top: 5px;" v-if="index === 1" :src="`${webBaseUrl}/images/second.png`" />
<img style="margin-top: 5px;" v-if="index===2" :src="`${webBaseUrl}/images/third.png`"/> <img style="margin-top: 5px;" v-if="index === 2" :src="`${webBaseUrl}/images/third.png`" />
<span style="margin-left: 10px" v-if="index!=2&&index!=0&&index!=1">{{index+1}}</span> <span style="margin-left: 10px" v-if="index != 2 && index != 0 && index != 1">{{ index + 1
}}</span>
</el-col> </el-col>
<!-- <el-tooltip :enterable="false" @click.native="jumpRouter(item)" effect="light" :content="item.name" placement="top-start"> --> <!-- <el-tooltip :enterable="false" @click.native="jumpRouter(item)" effect="light" :content="item.name" placement="top-start"> -->
<el-col :span="18" class="one-line-ellipsis"> {{ item.sysCreateUname }}</el-col> <el-col :span="18" class="one-line-ellipsis"> {{ item.sysCreateUname }}</el-col>
@@ -243,7 +291,8 @@
</div> </div>
<addQuestion ref="addQuestion" @sure="toDetail"></addQuestion> <addQuestion ref="addQuestion" @sure="toDetail"></addQuestion>
<editQuestion ref="editQuestion" @enSure="enSure" :editData="editData"></editQuestion> <editQuestion ref="editQuestion" @enSure="enSure" :editData="editData"></editQuestion>
<el-dialog class="checked-show" :visible.sync="qaFormCheckedShow" width="800px" top="14vh" :show-close="false" :modal="false"> <el-dialog class="checked-show" :visible.sync="qaFormCheckedShow" width="800px" top="14vh" :show-close="false"
:modal="false">
<agreement></agreement> <agreement></agreement>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<!-- <el-button @click="qaFormCheckedShow = false"> </el-button> --> <!-- <el-button @click="qaFormCheckedShow = false"> </el-button> -->
@@ -290,7 +339,7 @@ export default {
}, },
data() { data() {
return { return {
noData:true, noData: true,
qaFormCheckedShow: false, qaFormCheckedShow: false,
checked: false, checked: false,
// sex:null, // sex:null,
@@ -311,19 +360,19 @@ export default {
anking: 2, //排行榜 anking: 2, //排行榜
ankingList: [], ankingList: [],
controlListNew: [], //用来控制回复输入框的显示与否 controlListNew: [], //用来控制回复输入框的显示与否
curParent:{},//当前输入的上级的对象用于往answers中追加回复的内容 curParent: {},//当前输入的上级的对象用于往answers中追加回复的内容
curParentId:'',//当前回复的内容的id curParentId: '',//当前回复的内容的id
replyContent: "" ,//回复的内容 replyContent: "",//回复的内容
readonly:false,//是否只读,用于预览 readonly: false,//是否只读,用于预览
btnsShowRowId:'',//显示的button的条目id btnsShowRowId: '',//显示的button的条目id
replyDiaglog:{ replyDiaglog: {
show:false, show: false,
pageIndex:1, pageIndex: 1,
pageSize:8, pageSize: 8,
pages:1, pages: 1,
count:0, count: 0,
commentId:'', commentId: '',
list:[] list: []
} }
}; };
}, },
@@ -386,10 +435,10 @@ export default {
}, },
messageSave(type) { messageSave(type) {
let content; let content;
if(type == "set") { if (type == "set") {
content = this.userInfo.name + "设置了我的回答为" + "-" + this.detailData.title + "为最佳答案"; content = this.userInfo.name + "设置了我的回答为" + "-" + this.detailData.title + "为最佳答案";
} }
if(type == "send") { if (type == "send") {
content = this.userInfo.name + "回答了我的问答" + "-" + this.detailData.title; content = this.userInfo.name + "回答了我的问答" + "-" + this.detailData.title;
} }
let message = { let message = {
@@ -411,13 +460,13 @@ export default {
this.editData = {}; this.editData = {};
this.loadAnswer(); this.loadAnswer();
}, },
showRowInput(row,parent){ //显示行输框 showRowInput(row, parent) { //显示行输框
if(this.curParentId){ if (this.curParentId) {
this.curParentId=''; this.curParentId = '';
this.curParent={}; this.curParent = {};
}else{ } else {
this.curParentId=row.id; this.curParentId = row.id;
this.curParent=parent; this.curParent = parent;
} }
}, },
//获取问题详细信息 //获取问题详细信息
@@ -433,7 +482,7 @@ export default {
if (JSON.stringify(this.detailData) != "{}") { if (JSON.stringify(this.detailData) != "{}") {
this.getQaUserData(this.detailData); this.getQaUserData(this.detailData);
} }
}else{ } else {
this.noData = false; this.noData = false;
this.$message.error(res.message); this.$message.error(res.message);
} }
@@ -446,7 +495,7 @@ export default {
this.answerList = []; this.answerList = [];
} }
this.moreState = 2; this.moreState = 2;
if(this.pageIndex == 1) { if (this.pageIndex == 1) {
// 重置数据 // 重置数据
this.answerList = []; this.answerList = [];
} }
@@ -459,15 +508,15 @@ export default {
if (res.status == 200) { if (res.status == 200) {
let allList = []; let allList = [];
let ids = []; let ids = [];
let level3ParentIds=[]; let level3ParentIds = [];
if (res.result.list.length != 0) { if (res.result.list.length != 0) {
res.result.list.forEach(item => { res.result.list.forEach(item => {
item.avatar = ""; item.avatar = "";
item.sex = null; item.sex = null;
item.isAll=false;//字数过大时,显示隐藏控制 item.isAll = false;//字数过大时,显示隐藏控制
allList.push(item); allList.push(item);
ids.push(item.sysCreateAid); ids.push(item.sysCreateAid);
if(item.answers && item.answers.length != 0) { if (item.answers && item.answers.length != 0) {
item.answers.forEach(answers => { item.answers.forEach(answers => {
answers.avatar = ""; answers.avatar = "";
answers.sex = null; answers.sex = null;
@@ -482,9 +531,9 @@ export default {
this.answerList.push(...res.result.list); this.answerList.push(...res.result.list);
this.loadLevel3Data(level3ParentIds); this.loadLevel3Data(level3ParentIds);
} }
if(res.result.totalPages>this.pageIndex){ if (res.result.totalPages > this.pageIndex) {
that.moreState = 1; that.moreState = 1;
}else{ } else {
that.moreState = 3; that.moreState = 3;
} }
} else { } else {
@@ -495,26 +544,26 @@ export default {
}); });
}, },
//加载第三级的数据 //加载第三级的数据
loadLevel3Data(commentIdArray){ loadLevel3Data(commentIdArray) {
let $this=this; let $this = this;
if(commentIdArray && commentIdArray.length>0){ if (commentIdArray && commentIdArray.length > 0) {
apiQa.replayClevel3(commentIdArray).then(rs=>{ apiQa.replayClevel3(commentIdArray).then(rs => {
if(rs.status==200){ if (rs.status == 200) {
//先处理头像 //先处理头像
let aids=[]; let aids = [];
rs.result.forEach(item=>{ rs.result.forEach(item => {
item.avatar = ""; item.avatar = "";
item.sex=null; item.sex = null;
item.isAll=false; item.isAll = false;
aids.push(item.sysCreateAid); aids.push(item.sysCreateAid);
}); });
$this.getUserInfoList(rs.result,aids); $this.getUserInfoList(rs.result, aids);
$this.answerList.forEach(one1=>{ $this.answerList.forEach(one1 => {
if(one1.answers.length>0){ if (one1.answers.length > 0) {
one1.answers.forEach(one2=>{ one1.answers.forEach(one2 => {
one2.answers=one2.answers? one2.answers:[]; one2.answers = one2.answers ? one2.answers : [];
rs.result.forEach(rsRow=>{ rs.result.forEach(rsRow => {
if(rsRow.commentId==one2.id){ if (rsRow.commentId == one2.id) {
one2.answers.push(rsRow); one2.answers.push(rsRow);
} }
}) })
@@ -572,10 +621,10 @@ export default {
// if(this.content.indexOf('@'+this.detailData.name)!=-1){ // if(this.content.indexOf('@'+this.detailData.name)!=-1){
// content=this.content.slice(this.detailData.name.length+1) // content=this.content.slice(this.detailData.name.length+1)
// } // }
if(this.content.length < 1 || this.content.trim() == "@" + this.detailData.name) { if (this.content.length < 1 || this.content.trim() == "@" + this.detailData.name) {
return this.$message.warning("请输入回答"); return this.$message.warning("请输入回答");
}else { } else {
content = this.content; content = this.content.trim();
} }
apiQa.saveAnswer({ apiQa.saveAnswer({
qid: this.$route.query.id, qid: this.$route.query.id,
@@ -583,16 +632,16 @@ export default {
}).then(res => { }).then(res => {
if (res.status == 200) { if (res.status == 200) {
this.messageSave("send"); this.messageSave("send");
this.$message({message: "发布回答成功",type: "success"}); this.$message({ message: "发布回答成功", type: "success" });
this.answerShow = false; this.answerShow = false;
this.getQuestionDetail(); this.getQuestionDetail();
this.loadAnswer(); this.loadAnswer();
this.content = ""; this.content = "";
} else { } else {
this.$message({message: res.message,type: "error"}); this.$message({ message: res.message, type: "error" });
} }
}).catch(err => { }).catch(err => {
this.$message({message: "发布失败",type: "error"}); this.$message({ message: "发布失败", type: "error" });
}); });
}, },
//编辑回答 //编辑回答
@@ -629,7 +678,7 @@ export default {
type: "error" type: "error"
}); });
}); });
}).catch(() => {}); }).catch(() => { });
}, },
//设置为最佳答案 //设置为最佳答案
editAnsweBest(data) { editAnsweBest(data) {
@@ -655,68 +704,68 @@ export default {
this.loadAnswer(); this.loadAnswer();
this.$off("ensure"); this.$off("ensure");
}, },
showButtons(id){ showButtons(id) {
if(!this.readonly){ if (!this.readonly) {
this.btnsShowRowId=id; this.btnsShowRowId = id;
} }
}, },
hideButtons(){ hideButtons() {
this.btnsShowRowId=''; this.btnsShowRowId = '';
}, },
//展示全部 //展示全部
displayAll(item) { displayAll(item) {
if(!item.isAll && item.content.length > 170) { if (!item.isAll && item.content.length > 170) {
return item.content.slice(0, 170) + "..."; return item.content.slice(0, 170) + "...";
} }
return item.content; return item.content;
}, },
changeIsAll(item) { changeIsAll(item) {
item.isAll=!item.isAll; item.isAll = !item.isAll;
}, },
openAnswer() { openAnswer() {
this.answerShow = true; this.answerShow = true;
}, },
replyContentMethod(data,parent) { replyContentMethod(data, parent) {
if (!this.replyContent) { if (!this.replyContent) {
return this.$message.error("回复内容不能为空"); return this.$message.error("回复内容不能为空");
} }
//默认是一级评论2级数据 //默认是一级评论2级数据
let replyData={ let replyData = {
replayAid: data.sysCreateAid, replayAid: data.sysCreateAid,
replayName: data.sysCreateBy, replayName: data.sysCreateBy,
content: this.replyContent, content: this.replyContent.trim(),
parentId: data.id, parentId: data.id,
commentId: "", commentId: "",
clevel: 2 clevel: 2
} }
//console.log(data,'data'); //console.log(data,'data');
if(data.clevel==2){ //当前是一级评论 if (data.clevel == 2) { //当前是一级评论
replyData.commentId=data.id; replyData.commentId = data.id;
replyData.clevel=3; replyData.clevel = 3;
}else if(data.clevel>2){ } else if (data.clevel > 2) {
replyData.commentId=data.commentId; replyData.commentId = data.commentId;
replyData.clevel=3; replyData.clevel = 3;
} }
apiQa.saveComment(replyData).then(res => { apiQa.saveComment(replyData).then(res => {
if(res.status == 200) { if (res.status == 200) {
res.result.avatar = ""; res.result.avatar = "";
res.result.sex = null; res.result.sex = null;
res.result.isAll = false; res.result.isAll = false;
this.$message.success("回复成功"); this.$message.success("回复成功");
this.getUserInfoList([res.result], [res.result.sysCreateAid]); this.getUserInfoList([res.result], [res.result.sysCreateAid]);
this.curParentId=''; this.curParentId = '';
this.curParent={}; this.curParent = {};
this.replyContent=''; this.replyContent = '';
//添加到页面中 //添加到页面中
if(data.clevel<3){ if (data.clevel < 3) {
if(data.answers){ if (data.answers) {
data.answers.push(res.result); data.answers.push(res.result);
}else{ } else {
data.answers=[]; data.answers = [];
data.answers.push(res.result); data.answers.push(res.result);
} }
}else{ } else {
parent.answers.push(res.result); parent.answers.push(res.result);
} }
@@ -725,26 +774,26 @@ export default {
} }
}); });
}, },
showMoreReply(comment){ showMoreReply(comment) {
this.replyDiaglog.pages=1; this.replyDiaglog.pages = 1;
this.replyDiaglog.count=0; this.replyDiaglog.count = 0;
this.replyDiaglog.pageIndex=1; this.replyDiaglog.pageIndex = 1;
this.replyDiaglog.list=[]; this.replyDiaglog.list = [];
this.replyDiaglog.show=true; this.replyDiaglog.show = true;
this.replyDiaglog.commentId=comment.id; this.replyDiaglog.commentId = comment.id;
this.loadAllReplyData(false); this.loadAllReplyData(false);
}, },
loadMoreReply(){ loadMoreReply() {
this.replyDiaglog.pageIndex++; this.replyDiaglog.pageIndex++;
this.loadAllReplyData(true); this.loadAllReplyData(true);
}, },
loadAllReplyData(append){ loadAllReplyData(append) {
let params={ let params = {
pageIndex:this.replyDiaglog.pageIndex, pageIndex: this.replyDiaglog.pageIndex,
pageSize:this.replyDiaglog.pageSize, pageSize: this.replyDiaglog.pageSize,
commentId:this.replyDiaglog.commentId commentId: this.replyDiaglog.commentId
} }
let $this=this; let $this = this;
// apiComment.replyList(params).then(rs=>{ // apiComment.replyList(params).then(rs=>{
// if(rs.status==200){ // if(rs.status==200){
// $this.replyDiaglog.count=rs.result.count; // $this.replyDiaglog.count=rs.result.count;
@@ -774,22 +823,26 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
::v-deep .checked-show{ ::v-deep .checked-show {
.el-dialog__header{ .el-dialog__header {
padding:0; padding: 0;
} }
} }
::v-deep .el-card__body { ::v-deep .el-card__body {
padding: 0; padding: 0;
} }
::v-deep .bacolor:nth-child(odd) { ::v-deep .bacolor:nth-child(odd) {
background-color: #fff; background-color: #fff;
padding: 0 5px; padding: 0 5px;
} }
::v-deep .bacolor:nth-child(even) { ::v-deep .bacolor:nth-child(even) {
background-color: #f6f6f6; background-color: #f6f6f6;
padding: 0 5px; padding: 0 5px;
} }
.write-btn { .write-btn {
width: 80px; width: 80px;
// height: 50px; // height: 50px;
@@ -806,67 +859,82 @@ export default {
line-height: 34px; line-height: 34px;
font-size: 15px; font-size: 15px;
color: #333333; color: #333333;
.center-titlt { .center-titlt {
font-size: 15px; font-size: 15px;
color: #333333; color: #333333;
} }
.center { .center {
text-align: right; text-align: right;
} }
img { img {
margin-top: 5px; margin-top: 5px;
} }
} }
.detail { .detail {
background-color: #fff; background-color: #fff;
padding: 5px 20px 10px 20px; padding: 5px 20px 10px 20px;
.title { .title {
margin-top: 20px; margin-top: 20px;
font-size: 22px; font-size: 22px;
line-height: 30px; line-height: 30px;
word-break: break-all; word-break: break-all;
.resolve { .resolve {
// padding: 3px; // padding: 3px;
color: #08a890; color: #08a890;
margin-left: -10px; margin-left: -10px;
} }
.unResolve { .unResolve {
// padding:3px; // padding:3px;
color: #588afc; color: #588afc;
margin-left: -10px; margin-left: -10px;
} }
} }
.label { .label {
font-size: 15px; font-size: 15px;
color: #999999; color: #999999;
} }
.content { .content {
line-height: 21px; line-height: 21px;
margin: 14px 0 16px 0; margin: 14px 0 16px 0;
font-size: 15px; font-size: 15px;
color: #666666; color: #666666;
} }
.btn-div { .btn-div {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 9px; margin-bottom: 9px;
.answer-total { .answer-total {
font-size: 14px; font-size: 14px;
margin: 0 10px; margin: 0 10px;
} }
::v-deep .interact-bar-btns { ::v-deep .interact-bar-btns {
justify-content: flex-start !important; justify-content: flex-start !important;
} }
} }
.dian-btn { .dian-btn {
margin-top: 50px; margin-top: 50px;
width: 60%; width: 60%;
} }
} }
.answer { .answer {
margin-top: 14px; margin-top: 14px;
background-color: #fff; background-color: #fff;
border-bottom: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
// padding: 5px 20px 20px 20px; // padding: 5px 20px 20px 20px;
.answer-top { .answer-top {
font-size: 16px; font-size: 16px;
@@ -874,6 +942,7 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
img { img {
margin-right: 10px; margin-right: 10px;
width: 30px; width: 30px;
@@ -881,6 +950,7 @@ export default {
border-radius: 50%; border-radius: 50%;
vertical-align: middle; vertical-align: middle;
} }
.zuijia { .zuijia {
width: 106px; width: 106px;
height: 42px; height: 42px;
@@ -895,35 +965,42 @@ export default {
text-align: center; text-align: center;
} }
} }
.answer-body{
.answer-body {
padding-left: 40px; padding-left: 40px;
.answer-text{
.answer-text {
margin: 20px 0 15px; margin: 20px 0 15px;
line-height: 24px; line-height: 24px;
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-all; word-break: break-all;
span { span {
color: #409eff; color: #409eff;
cursor: pointer; cursor: pointer;
margin-left: 5px; margin-left: 5px;
} }
} }
.answer-time{
.answer-time {
font-size: 14px; font-size: 14px;
color: #8590a6; color: #8590a6;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.answer-boot{
.answer-boot {
height: 35px; height: 35px;
line-height: 35px; line-height: 35px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.answer-boot-btns{
a{ .answer-boot-btns {
margin-right:15px; a {
span{ margin-right: 15px;
span {
margin-left: 6px; margin-left: 6px;
color: #8590A6; color: #8590A6;
font-size: 14px; font-size: 14px;
@@ -932,89 +1009,109 @@ export default {
} }
} }
.answer-reply { .answer-reply {
display: flex; display: flex;
margin-bottom: 10px; margin-bottom: 10px;
.el-button { .el-button {
margin-left: 10px; margin-left: 10px;
} }
} }
} }
// .bottom { // .bottom {
// text-align: right; // text-align: right;
// } // }
} }
.comment{
.comment {
margin-top: 10px; margin-top: 10px;
background-color: #FFFFFF; background-color: #FFFFFF;
border-bottom: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
.comment-top{
.comment-top {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding-bottom:10px; padding-bottom: 10px;
font-weight: 500; font-weight: 500;
line-height: 30px; line-height: 30px;
font-size: 1.1em; font-size: 1.1em;
.comment-author{
.comment-author {
display: flex; display: flex;
align-items: center; align-items: center;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
.comment-author-text{
.comment-author-text {
margin-left: 10px; margin-left: 10px;
color: #8590A6; color: #8590A6;
font-size:14px; font-size: 14px;
} }
} }
.comment-time{
.comment-time {
color: #666666; color: #666666;
font-size: 12px; font-size: 12px;
} }
} }
.comment-body{
.comment-body {
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;
span{
span {
cursor: pointer; cursor: pointer;
color: #409EFF color: #409EFF
} }
} }
.comment-btns{
.comment-btns {
// padding: 5px 10px 10px 0px; // padding: 5px 10px 10px 0px;
height: 35px; height: 35px;
line-height: 35px; line-height: 35px;
a{
margin-right:15px; a {
span{ margin-right: 15px;
span {
margin-left: 6px; margin-left: 6px;
color: #8590A6; color: #8590A6;
font-size: 14px; font-size: 14px;
} }
} }
} }
.comment-reply { .comment-reply {
display: flex; display: flex;
margin-bottom: 10px; margin-bottom: 10px;
.el-button { .el-button {
margin-left: 10px; margin-left: 10px;
} }
} }
} }
.comment-replys{
.comment-replys {
padding-left: 40px; padding-left: 40px;
} }
} }
.comment-last{
.comment-last {
border-bottom: none; border-bottom: none;
} }
.answer-reply-box { .answer-reply-box {
margin-top: 10px; margin-top: 10px;
background-color: #fff; background-color: #fff;
padding: 5px 20px 10px 20px; padding: 5px 20px 10px 20px;
} }
// ::v-deep .publishAnswer { // ::v-deep .publishAnswer {
// padding: 24px 20px; // padding: 24px 20px;
// .el-card__body { // .el-card__body {
@@ -1041,6 +1138,7 @@ export default {
margin-bottom: -24px; margin-bottom: -24px;
height: 190px; height: 190px;
line-height: 40px; line-height: 40px;
.el-link { .el-link {
line-height: 1; line-height: 1;
} }

View File

@@ -252,7 +252,7 @@ export default {
apiQa apiQa
.saveAnswer({ .saveAnswer({
qid: this.answer.id, qid: this.answer.id,
content: this.answer.inputValue content: this.answer.inputValue.trim()
}) })
.then(res => { .then(res => {
if (res.status == 200) { if (res.status == 200) {