Compare commits
No commits in common. "ef02c7a2c0e20970a63b4d9a2ca7952fa35d8cf1" and "fc3c2bd71c7e0515e9e0a164086e33092cd3c724" have entirely different histories.
ef02c7a2c0
...
fc3c2bd71c
File diff suppressed because one or more lines are too long
|
@ -1,239 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<el-tabs type="border-card" v-model="activeTab" @tab-click="getListData">
|
|
||||||
<el-tab-pane v-for="item in choseList " :label="item">
|
|
||||||
|
|
||||||
<div class="main-box" v-if="dataList.length>0">
|
|
||||||
<div class="main" v-for="item in dataList" >
|
|
||||||
<div class="left" @click="read(item)" >
|
|
||||||
<div :class="item.isRead === '0' ? 'not-read' : 'readed'"></div>
|
|
||||||
{{ item.sendText }}
|
|
||||||
</div>
|
|
||||||
<div style="display: inline-flex;">
|
|
||||||
<div class="right">{{ '发送时间:' + item.sendTime }}</div>
|
|
||||||
<div class="right" style="margin-left: 10px;">{{ '发送人:' + item.sender }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
|
|
||||||
@pagination="getList" />
|
|
||||||
</div>
|
|
||||||
<div v-else class="content"> <img class="img" src="@/assets/home/not-data.png" ></div>
|
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
<el-dialog
|
|
||||||
title="查看消息详情"
|
|
||||||
:visible.sync="isShowMsg"
|
|
||||||
width="50%"
|
|
||||||
:before-close="handleClose">
|
|
||||||
<div class="title">消息时间轴 </div>
|
|
||||||
<el-timeline>
|
|
||||||
<el-timeline-item v-for="item in infoList" :timestamp="item.sendTime" placement="top" >
|
|
||||||
<el-card >
|
|
||||||
<h4>{{item.infoType}}{{item.sendText}}</h4>
|
|
||||||
<p>{{item.sender}} 提交于 {{item.sendTime}}</p>
|
|
||||||
</el-card>
|
|
||||||
</el-timeline-item>
|
|
||||||
</el-timeline>
|
|
||||||
<div class="title">添加回复 </div>
|
|
||||||
<div style="margin:10px">
|
|
||||||
<el-input type="textarea" :rows="2" placeholder="请输入回复内容..." v-model="shareContent">
|
|
||||||
</el-input>
|
|
||||||
</div>
|
|
||||||
<div> <el-button class="agreeButton" @click="sendMsg">发送</el-button></div>
|
|
||||||
<!-- <span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="handleClose">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
|
|
||||||
</span> -->
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
|
|
||||||
import { listMsg, readMsg,getMsgDetail } from "@/api/home";
|
|
||||||
import { sendMessage} from "@/api/home";
|
|
||||||
export default {
|
|
||||||
name: "SendMsg",
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
shareContent:'',
|
|
||||||
repayUser:{},
|
|
||||||
infoList:[],
|
|
||||||
isShowMsg:false,
|
|
||||||
activeTab: '0',
|
|
||||||
choseList: ['未读消息', '已读消息', '全部消息'],
|
|
||||||
queryParams: {
|
|
||||||
pageNum: 1,
|
|
||||||
pageSize: 10,
|
|
||||||
isRead: '0',
|
|
||||||
},
|
|
||||||
total: 4,
|
|
||||||
dataList: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.getList();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
getListData() {
|
|
||||||
if (this.activeTab == 0) {//未读
|
|
||||||
this.queryParams.isRead = '0'
|
|
||||||
} else if (this.activeTab == 1) {//已读
|
|
||||||
this.queryParams.isRead = '1'
|
|
||||||
} else {
|
|
||||||
this.queryParams.isRead = ''
|
|
||||||
}
|
|
||||||
this.getList();
|
|
||||||
},
|
|
||||||
/** 查询消息列表 */
|
|
||||||
getList() {
|
|
||||||
this.loading = true;
|
|
||||||
listMsg(this.queryParams).then(response => {
|
|
||||||
this.dataList = response.rows;
|
|
||||||
this.total = response.total;
|
|
||||||
this.loading = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
//消息已读
|
|
||||||
read(item){
|
|
||||||
this.isShowMsg=true;
|
|
||||||
this.repayUser=item
|
|
||||||
getMsgDetail(item.id).then(response => {
|
|
||||||
if(response.code !=500){
|
|
||||||
this.infoList=response.data
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
sendMsg(){
|
|
||||||
let readList=[]
|
|
||||||
readList.push(this.repayUser.sender)
|
|
||||||
let params={
|
|
||||||
readerList: readList,
|
|
||||||
sendText:this.shareContent,
|
|
||||||
parentId:this.infoList[0].id
|
|
||||||
}
|
|
||||||
sendMessage(params).then(response => {
|
|
||||||
if(response.code==200){
|
|
||||||
this.$message.success("消息回复成功!")
|
|
||||||
}else{
|
|
||||||
this.$message.error("消息回复失败!")
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
},
|
|
||||||
|
|
||||||
//关闭
|
|
||||||
handleClose(){
|
|
||||||
this.isShowMsg=false
|
|
||||||
readMsg(this.repayUser.id).then(response => {
|
|
||||||
if(response.code !=500){
|
|
||||||
// this.$Message.info("消息已读")
|
|
||||||
this.getList()
|
|
||||||
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.agreeButton {
|
|
||||||
display: inline-block;
|
|
||||||
line-height: 8px;
|
|
||||||
width: 80px;
|
|
||||||
height: 32px;
|
|
||||||
white-space: nowrap;
|
|
||||||
cursor: pointer;
|
|
||||||
color: #ffffff;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
text-align: center;
|
|
||||||
-webkit-box-sizing: border-box;
|
|
||||||
box-sizing: border-box;
|
|
||||||
outline: 0;
|
|
||||||
margin-left: 10px;
|
|
||||||
-webkit-transition: .1s;
|
|
||||||
transition: .1s;
|
|
||||||
font-weight: 500;
|
|
||||||
//padding: 12px 20px;
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 4px;
|
|
||||||
background-color: #068f5c;
|
|
||||||
}
|
|
||||||
|
|
||||||
.agreeButton:hover {
|
|
||||||
background: #65a5f9;
|
|
||||||
border-color: #65a5f9;
|
|
||||||
color: #FFF;
|
|
||||||
}
|
|
||||||
.title {
|
|
||||||
padding-left: 20px;
|
|
||||||
color: #212121;
|
|
||||||
font-size: 16px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
margin-top: 10px;
|
|
||||||
background: url("~@/assets/ucs/biaoti.png") no-repeat;
|
|
||||||
background-position-y: 7px;
|
|
||||||
}
|
|
||||||
.content{
|
|
||||||
height: 800px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.img{
|
|
||||||
position: absolute;
|
|
||||||
top:50%;
|
|
||||||
left:50%;
|
|
||||||
transform:translate(-50%,-50%);
|
|
||||||
}
|
|
||||||
.main-box {
|
|
||||||
width: 100%;
|
|
||||||
background: #fff;
|
|
||||||
height: 800px;
|
|
||||||
|
|
||||||
.main {
|
|
||||||
background: #fff;
|
|
||||||
margin: 0 5px;
|
|
||||||
// min-height: 80px;
|
|
||||||
// overflow-y: scroll;
|
|
||||||
border-top: 1px solid #dddee1;
|
|
||||||
|
|
||||||
.readed {
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
border-radius: 5px;
|
|
||||||
display: inline-flex;
|
|
||||||
background: green;
|
|
||||||
}
|
|
||||||
|
|
||||||
.not-read {
|
|
||||||
display: inline-flex;
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
border-radius: 5px;
|
|
||||||
background: red;
|
|
||||||
}
|
|
||||||
|
|
||||||
.left {
|
|
||||||
margin-top: 5px;
|
|
||||||
width: 90%;
|
|
||||||
max-height: 43px;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
display: -webkit-box;
|
|
||||||
-webkit-line-clamp: 2;
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
word-break: break-all;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.left:hover{
|
|
||||||
color:#068f5c;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
margin-top: 5px;
|
|
||||||
|
|
||||||
height: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Reference in New Issue