Skip to content

P
pica-admin-consultation
提交 254805e1 编写于 作者: huangwensu's avatar huangwensu
浏览文件
操作

删除多余文件

上级 5273e5c3
显示空白字符变更
内嵌 并排
正在显示 包含 1 行增加 和 3083 行删除
src/router/router.js
浏览文件 @ 254805e1
import App from '../App'
// // 消息查询
// const searchMessageList = r => require.ensure([], () => r(require('../views/IM/search-message/list.vue')), 'searchMessageList')
// const searchMessageDetail = r => require.ensure([], () => r(require('../views/IM/search-message/detail.vue')), 'searchMessageDetail')
// // 当前会话
// const currentSessionList = r => require.ensure([], () => r(require('../views/IM/current-session/index.vue')), 'currentMessageIndex')
// // 我要群发
// const chainMessage = r => require.ensure([], () => r(require('../views/IM/chain-message/index.vue')), 'chainMessage')
// // 历史群发
// const chainHistoryList = r => require.ensure([], () => r(require('../views/IM/chain-history/list.vue')), 'chainHistoryList')
// const chainHistoryDetail = r => require.ensure([], () => r(require('../views/IM/chain-history/detail.vue')), 'chainHistoryDetail')
// 问诊订单管理
const diagnosisList = r => require.ensure([], () => r(require('../views/IM/diagnosis-admin/diagnosis-list.vue')), 'diagnosisList')
const diagnosisIm = r => require.ensure([], () => r(require('../views/IM/diagnosis-admin/diagnosis-im.vue')), 'diagnosisIm')
......@@ -36,25 +22,5 @@ export default [{
path: '/diagnosis-live',
component: diagnosisLive
}
// {
// path: '/search-message-list',
// component: searchMessageList
// }, {
// path: '/search-message-detail',
// component: searchMessageDetail
// }, {
// path: '/current-session-list',
// component: currentSessionList
// }, {
// path: '/chain-message',
// component: chainMessage
// }, {
// path: '/chain-history-list',
// component: chainHistoryList
// }, {
// path: '/chain-history-detail',
// component: chainHistoryDetail
// }
]
}]
\ No newline at end of file
src/views/IM/chain-history/detail.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="chain-history-detail">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :jumPathThird="jumPathThird"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="title">群发标题：<span>{{detailData.title}}</span></div>
<div class="user-list">目标用户：<span @click="downFile">{{detailData.fileName}}</span></div>
<div class="msg-container" v-for="(item, index) in detailData.contentModelList" :key="index">
<div v-if="item.type == 0" class="text-content">
<div>{{item.info}}</div>
</div>
<div v-if="item.type == 1" class="img-content" v-viewer>
<div class="img-box">
<img
class="img"
:src="item.url"
:style="{width: item.newW + 'px', height: item.newH + 'px' }"
alt
/>
</div>
</div>
<div v-if="item.type == 2" class="file-content">
<div class="file-con" @click="openPDF(item.url)">
<div class="file-left">
<span class="name">{{item.info | shortName(23)}}</span>
<span class="size">{{item.fileSize}}</span>
</div>
<div class="file-right">
<img src="../../../assets/image/IM/icon-pdf.png" alt />
</div>
</div>
</div>
<div v-if="item.type == 3" class="link-content">
<div class="link-text">{{item.info}}</div>
</div>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { openLoading, closeLoading, betaHandle } from "@/utils/utils";
import * as commonUtil from "@/utils/utils";
export default {
components: {
BreadCrumb,
},
data() {
return {
jumPathThird: '/chain-history-list',
curmbFirst: "历史群发",
curmbSecond: "任务详情",
detailData: {
title: '',
fileName: '',
contentModelList: []
},
historyId: '',
};
},
created() {
this.historyId = this.$route.query.id;
},
// 挂载到Dom完成时
mounted() {
console.log('@@@@@@@@ in 挂载到Dom完成时 GJY');
commonUtil.resizeHeight();
this.getData();
},
methods: {
// 获取历史群发数据
getData() {
this.loading = true;
let url = `/im/group/info/${this.historyId}`
this.GET(url).then(res => {
this.loading = false;
if (res.code == "000000") {
this.detailData = res.data;
this.detailData.contentModelList.map((item) => {
if(item.type == 1) {
this.imgSizeHandleNew(item, item.width, item.height);
}
if(item.type == 2) { // 0 文本 1 图片 2PDF 3链接
item.fileSize = betaHandle(item.fileSize);
}
})
}
});
},
// 下载目标文件
downFile() {
let a = document.createElement('a');
a.setAttribute('href', this.detailData.fileUrl);
a.click();
},
// 打开PDF
openPDF(url) {
window.open(url, "__blank");
}
}
};
</script>
<style lang="scss" scoped>
.chain-history-detail {
.component-content {
margin: 80px 20px 0 20px;
padding: 10px 0px 0 20px;
background: #fff;
overflow: auto;
.title {
font-size: 14px;
color: #000;
padding: 0 5px 10px 0;
}
.user-list {
font-size: 14px;
color: #000;
padding: 0 5px 20px 0;
border-bottom: 1px solid #F0F1F2;
span {
color: #0D9078;
}
}
.text-content {
padding: 16px 0;
color: #333333;
border-bottom: 1px solid #F0F1F2;
}
.img-content {
padding: 16px 0;
border-bottom: 1px solid #F0F1F2;
cursor: pointer;
.img-box {
max-width: 192px;
max-height: 320px;
overflow: hidden;
}
}
.file-content {
padding: 16px 0;
border-bottom: 1px solid #F0F1F2;
.file-con {
display: flex;
flex-direction: row;
max-width: 260px;
text-align: left;
padding: 10px 15px;
background: #f0f1f2;
border-radius: 8px;
cursor: pointer;
.file-left {
display: flex;
flex-direction: column;
justify-content: space-around;
width: 231px;
.name {
font-size: 13px;
color: #333333;
}
.size {
font-size: 12px;
color: #999999;
}
}
.file-right {
width: 36px;
height: 44px;
& > img {
width: 36px;
height: 100%;
border-radius: 3px;
}
}
}
}
.link-content {
padding: 16px 0;
color: #2f86f6;
border-bottom: 1px solid #F0F1F2;
}
}
}
</style>
\ No newline at end of file
src/views/IM/chain-history/list.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="chain-history-wrap">
<div class="component-content screenSet" id="screenSet">
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;margin-right:0px;">
<el-form ref="serchForm" inline :model="searchParam" label-width="15px" style="width:100%;text-align:right;">
<el-form-item label="">
<el-input clearable v-model="searchParam.messageLogId" size="small" placeholder="请输入任务编号" @change="search(1)">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</el-form-item>
<el-form-item label="" style="position:relative;top:-8px;left:0;margin-bottom: 0px;">
<el-date-picker
v-model="date"
size="small"
type="date"
placeholder="请选择日期"
@change="search(1)"></el-date-picker>
</el-form-item>
</el-form>
</el-row>
<el-table :data="tableData" style="width: 99%;padding: 0 30px;" v-loading="loading">
<el-table-column prop="id" label="任务ID" min-width="50" align="left"></el-table-column>
<el-table-column prop="title" label="任务名" min-width="100" align="left"></el-table-column>
<el-table-column prop="totalNumber" label="群发人数" min-width="50" align="left"></el-table-column>
<el-table-column label="发送日期" min-width="100" align="left">
<template slot-scope="scope">
<span>{{scope.row.createdTime | dateFilter}}</span>
</template>
</el-table-column>
<el-table-column prop="createdName" label="发送者" min-width="50" align="left"></el-table-column>
<el-table-column label="发送状态" min-width="50" align="left">
<template slot-scope="scope">
<span>{{scope.row.status | statusFilter}}</span>
</template>
</el-table-column>
<el-table-column label="任务详情" fixed="right" align="left" min-width="100">
<template slot-scope="scope">
<el-button type="text" size="medium" @click="edit(scope.row)">查看</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../../assets/image/no-content1.png" />
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { validateWord } from "@/utils/validate.js";
import { openLoading, closeLoading } from "@/utils/utils";
import * as commonUtil from "@/utils/utils";
let vm = null;
export default {
data() {
return {
searchParam: {
chooseDate: '',
messageLogId: '',
pageNo: 1,
pageSize: 15
},
tableData: [],
totalRows: 0,
loading: false,
date: ''
};
},
computed: {},
filters: {
dateFilter(val) {
return new Date(val).format("yyyy-MM-dd")
},
statusFilter(index) {
let str = "";
if (index == 1 || index == 0) {
str = "发送中";
} else if (index == 2) {
str = "已发送";
} else if (index == 3) {
str = "发送失败";
}
return str;
}
},
created() {
},
// 挂载到Dom完成时
mounted() {
commonUtil.resizeHeight(92);
this.search();
},
methods: {
// 列表查询
search(a) {
if(a) this.searchParam.pageNo = 1;
this.loading = true;
this.searchParam.chooseDate = this.date ? new Date(this.date).getTime() : '';
const {pageNo, pageSize, chooseDate, messageLogId} = this.searchParam;
let url = `/im/group/list?pageNo=${pageNo}&pageSize=${pageSize}&chooseDate=${chooseDate}&messageLogId=${messageLogId}`;
this.GET(url).then(res => {
this.loading = false;
if (res.code == "000000") {
this.tableData = res.data.list;
this.totalRows = res.data.total;
}
});
},
// 查看消息详情
edit(row) {
this.$router.push({ path: `/chain-history-detail`,query: {id: row.id}});
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.search();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.search();
}
}
};
</script>
<style lang="scss" scoped>
.chain-history-wrap {
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
overflow: auto;
.search-title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 10px 12px;
font-size: 12px;
margin-bottom: 20px;
border-bottom: 1px solid #efefef;
.num {
color: #0D9078;
}
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
</style>
\ No newline at end of file
src/views/IM/chain-message/index.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="chain-message-wrap">
<div class="component-content" id="screenSet">
<div class="search-title">
<p>群发消息</p>
</div>
<el-form class="form" ref="form" :model="searchParam">
<el-form-item label="群发标题">
<el-input clearable v-model="searchParam.title" size="mini" maxlength="20" placeholder="请输入群发标题" style="width: 300px;"></el-input>
</el-form-item>
<el-form-item label="目标用户">
<el-input clearable v-model="excelfileName" readonly size="mini" placeholder="请上传目标用户" style="width: 300px;"></el-input>
<el-upload
class="upload-demo"
accept=".xlsx"
action="#"
:before-upload="uploadUserFile"
>
<el-button class="upload-btn" type="default" size="mini">
<img src="../../../assets/image/IM/upload-2.png"/>
<span>上传列表</span>
</el-button>
</el-upload>
</el-form-item>
<div class="user-list" @click="downTemplate">
<img src="../../../assets/image/IM/down-2.png"/>
<span>用户列表模板.xsls</span>
</div>
<div class="content-container" v-for="(item, index) in searchParam.contentModelList" :key="index">
<div class="text-content" v-if="item.type === 0">
<p>文本信息<i class="el-icon-error" @click="deleteText(item,index)"></i></p>
<el-input
:autosize="{ minRows: 4 }"
type="textarea"
clearable
v-model="item.info"
size="mini"
maxlength="499"
show-word-limit
placeholder="请输入文本信息"
style="width: 600px;"></el-input>
</div>
<div class="file-content" v-if="item.type == 1 || item.type == 2">
<p>文件信息<i class="el-icon-error" @click="deleteFile(item,index)"></i></p>
<el-input v-model="item.info" readonly size="mini" placeholder="请上传文件信息" style="width: 300px;"></el-input>
<el-upload
class="upload-demo"
action="#"
accept="image/jpeg,image/jpg,image/png,application/pdf"
:before-upload="uploadImportFile">
<el-button class="upload-btn" type="default" size="mini" @click="getFileIndex(index)">
<img src="../../../assets/image/IM/upload-2.png"/>
<span>上传文件</span>
</el-button>
</el-upload>
</div>
<div class="link-content" v-if="item.type == 3">
<p>链接<i class="el-icon-error" @click="deleteLink(item,index)"></i></p>
<el-select clearable v-model="item.info" size="mini" placeholder="请选择链接" style="width: 300px;">
<el-option
v-for="item in linkList"
:key="item.id"
:label="item.title"
:value="item.title">
</el-option>
</el-select>
</div>
</div>
</el-form>
<div class="content-type">
<el-button type="default" size="mini" @click="addText">
<img src="../../../assets/image/IM/file-text-2.png"/>
<span>文本</span>
</el-button>
<el-button type="default" size="mini" @click="addFile">
<img src="../../../assets/image/IM/folder-open-2.png"/>
<span>文件</span>
</el-button>
<el-button type="default" size="mini" @click="addLink">
<img src="../../../assets/image/IM/link-2.png"/>
<span>链接</span>
</el-button>
</div>
<el-button class="confirm-btn" size="mini" @click="confirmSubmit">确认群发</el-button>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { openLoading, closeLoading, isEmptyUtils } from "@/utils/utils";
import { getPicaKFAccid, getPhomeDemain } from "@/utils";
import * as commonUtil from "@/utils/utils";
export default {
components: {
BreadCrumb
},
data() {
return {
excelfileName:'',
fileName: '',
contentList: [],
searchParam: {
title: '',
fileModel: {},
contentModelList: []
},
linkList: [],
templateFileUrl: '',
fileIndex: 0
};
},
created() {
},
// 挂载到Dom完成时
mounted() {
commonUtil.resizeHeight(92);
this.getFiveContentList();
},
methods: {
// 上传列表
uploadUserFile(file) {
let _this = this;
let arr = file.type.split("/");
let ext = "." + arr[1];
let name = file.name;
let reader = new FileReader();
reader.onload = function(e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
let fileArray = {
type: "",
base64: fileJson
};
_this.excelfileName = file.name;
_this.searchParam.fileModel = fileArray;
}
reader.readAsDataURL(file);
},
// 下载用户模板
downTemplate() {
let a = document.createElement('a');
this.templateFileUrl = 'https://file.yunqueyi.com/im/group/%E7%94%A8%E6%88%B7%E5%88%97%E8%A1%A8%E6%A8%A1%E6%9D%BF.xlsx';
a.setAttribute('href', this.templateFileUrl);
a.click();
},
// 添加文本
addText() {
if(this.searchParam.contentModelList.length < 5) {
this.searchParam.contentModelList.push({
type: 0, // 0 文本 1图片 2PDF 3链接
info: ''
})
}else {
this.$message({
message: '添加内容数不能大于5',
type: 'warning'
});
}
},
// 删除文本
deleteText(item, index) {
this.searchParam.contentModelList.splice(index, 1)
},
// 添加文件
addFile() {
if(this.searchParam.contentModelList.length < 5) {
this.searchParam.contentModelList.push({
type: 1,
info: '',
url: '',
width: 0,
height: 0
})
}else {
this.$message({
message: '添加内容数不能大于5',
type: 'warning'
});
}
},
// 上传文件
getFileIndex(index) {
this.fileIndex = index;
},
uploadImportFile(file) {
let _this = this;
const isLt5M = file.size / 1024 / 1024 < 5;
if (!isLt5M) {
this.$message.error('上传文件不能超过5MB!');
return isLt5M
}
_this.searchParam.contentModelList[this.fileIndex].info = file.name;
if(file.type == 'image/png' || file.type == 'image/jpg' || file.type == "image/jpeg") {
_this.searchParam.contentModelList[this.fileIndex].type = 1; // 图片
let imgFile = new FileReader();
imgFile.readAsDataURL(file);
imgFile.onload = function(theFile) {
let image = new Image();
image.src = theFile.target.result;
image.onload = function() {
let cox = this;
_this.searchParam.contentModelList[_this.fileIndex].width = cox.width;
_this.searchParam.contentModelList[_this.fileIndex].height = cox.height;
}
}
}else if(file.type == 'application/pdf') {
_this.searchParam.contentModelList[this.fileIndex].type = 2; // pdf
}
_this.searchParam.contentModelList[this.fileIndex].fileSize = file.size;
doUpload(_this, file, getFilePath(file,null), 'preview4', 'progress1', 1).then( path => {
_this.fileName = file.name;
_this.searchParam.contentModelList[this.fileIndex].url = path.fullPath;
});
},
// 删除文件
deleteFile(item, index) {
this.searchParam.contentModelList.splice(index, 1)
},
// 添加链接
addLink() {
if(this.searchParam.contentModelList.length < 5) {
this.searchParam.contentModelList.push({
type: 3,
info: '',
url: ''
})
}else {
this.$message({
message: '添加内容数不能大于5',
type: 'warning'
});
}
},
// 获取积木列表
getFiveContentList() {
this.GET(
"/contents/admin/template/queryTemplate?publishFlag=5&pageNo=1&pageSize=99999"
).then(res => {
if (res.code === "000000") {
this.linkList = res.data.templateList || [];
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 删除链接
deleteLink(item, index) {
this.searchParam.contentModelList.splice(index, 1)
},
// 确认群发
confirmSubmit() {
this.loading = true;
let req = this.searchParam;
for(let i = 0; i < req.contentModelList.length; i++) {
if(req.contentModelList[i].type == 3) {
this.linkList.forEach((element, index) => {
if(element.title == req.contentModelList[i].info) {
req.contentModelList[i].url = getPhomeDemain() + `/template_v2/?id=${element.id}`;
}
});
}
}
if(!req.title) {
this.$message({
message: '请输入标题',
type: 'warning'
});
return
}
if(isEmptyUtils(req.fileModel.base64)) {
this.$message({
message: '请上传人员名单',
type: 'warning'
});
return
}
if(req.contentModelList.length < 1) {
this.$message({
message: '请输入群发内容',
type: 'warning'
});
return
}else {
let list = req.contentModelList;
for(let i = 0; i < list.length; i++) {
if(!list[i].info) {
this.$message({
message: '请输入群发内容',
type: 'warning'
});
return
}
}
}
this.$confirm('点击“确定”，将开始执行群发任务，请务必确认内容无误', '群发确认', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.POST("/im/group/messages", req).then(res => {
this.loading = false;
if(res.code == '000000') {
if (res.data.status == 1) {
this.searchParam.title = "";
this.searchParam.fileModel = {};
this.searchParam.contentModelList = [];
this.excelfileName = '';
this.$message({
message: '群发成功',
type: 'success'
});
}else {
this.$message({
message: res.data.message,
type: 'error'
});
}
}
});
})
}
}
};
</script>
<style lang="scss">
.chain-message-wrap {
.el-button:hover, .el-button:focus {
border: 1px solid #DCDFE6 !important;
background: #fff !important;
color: #606266 !important;
}
.component-content {
margin: 20px 20px 0;
padding: 10px;
background: #fff;
overflow: auto;
.search-title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 10px 12px;
font-size: 12px;
margin-bottom: 20px;
p {
font-size: 16px;
color: #000;
}
}
.form {
padding: 0 10px;
}
.el-form-item .el-form-item__label{
font-size: 14px !important;
float: none !important;
line-height: 20px;
}
.user-list {
display: inline;
margin-top: -10px;
img {
float: left;
width: 15px;
height: 15px;
margin: 2px 2px 0 0;
}
span{
color: #1890FF;
font-size: 14px;;
}
}
.upload-demo {
display: inline-block;
button {
position: relative;
width: 104px;
img {
position: absolute;
left: 18%;
top: 20%;
width: 15px;
}
span {
padding-left: 10px;
}
}
}
.text-content, .file-content, .link-content {
margin: 10px 0 25px;
font-size: 14px;
color: #000;
opacity: 0.85;
p{
margin-bottom: 10px;
i {
color: #979899;
font-size: 14px;
padding-left: 8px;
}
}
}
.content-type {
margin-top: 20px;
margin-bottom: 20px;
padding: 0 10px;
button {
position: relative;
width: 84px;
img {
position: absolute;
left: 22%;
top: 17%;
width: 20%;
}
span {
padding-left: 10px;
}
}
}
.confirm-btn, .confirm-btn:hover, .confirm-btn:focus {
margin: 0 10px;
background: #0D9078 !important;
color: #fff !important;
border: none;
}
}
}
</style>
\ No newline at end of file
src/views/IM/current-session/index.scss 已删除 100644 → 0
浏览文件 @ 5273e5c3
.current-session-wrap {
.component-content {
display: flex;
flex-direction: row;
// min-height: 600px;
min-width: 1200px;
font-size: 14px;
.left {
width: 270px;
// padding: 0 25px 15px;
border-right: 2px solid #f5f5f5;
.l-header {
display: flex;
flex-direction: row;
height: 52px;
justify-content: space-between;
align-items: center;
padding: 0 12px 0 25px;
p {
display: flex;
flex-direction: row;
align-items: center;
color: #0d9078;
cursor: pointer;
img {
width: 16px;
height: 16px;
margin-right: 4px;
}
span {
font-size: 14px;
color: #0d9078;
}
}
// & > span:first-child {
// font-size: 14px;
// }
// & > span:last-child {
// color: #0d9078;
// cursor: pointer;
// }
}
.c-num {
padding: 0 25px;
height: 40px;
line-height: 40px;
font-size: 12px;
background: #fffbe6;
}
.session-list {
width: 100%;
height: 100%;
overflow: scroll;
& > .item {
width: 100%;
display: flex;
height: 72px;
flex-direction: row;
align-items: center;
padding: 0 12px 0 25px;
cursor: pointer;
.img-wrapper {
// position: relative;
// top: 0;
// left: 0;
width: 24px;
height: 24px;
margin-right: 10px;
img {
width: 100%;
height: 100%;
border-radius: 20px;
}
}
& > .desc {
flex: 1;
.top {
display: flex;
flex-direction: row;
justify-content: space-between;
.name {
}
}
.bottom {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
font-size: 12px;
color: #999999;
.num {
display: inline-block;
min-width: 16px;
padding: 2px 4px;
border-radius: 8px;
text-align: center;
color: #ffffff;
background: #ff4d4f;
}
& > img {
display: block;
width: 15px;
height: 15px;
padding: 2px 0 2px 4px;
}
}
}
&.current {
background: #f8f9fa;
}
}
}
}
.center {
flex: 1;
.c-header {
padding: 0 25px;
height: 56px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
border-bottom: 2px solid #f5f5f5;
& > .c-header-l {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
& > img {
display: inline-block;
width: 24px;
height: 24px;
border-radius: 12px;
margin-right: 8px;
}
& > .name {
margin-right: 25px;
color: #333333;
}
& > .time-tip {
font-size: 12px;
color: #999999;
}
}
.close-btn {
width: 100px;
color: #c7c8c9;
cursor: pointer;
}
}
.msg-content {
// width: 100%;
// height: 650px;
word-break: break-all;
overflow: scroll;
display: flex;
flex-direction: column;
margin: 10px 20px;
.msg-item {
display: flex;
flex-direction: row;
margin: 12px 0;
.msg-item-img {
width: 36px;
height: 36px;
margin-right: 12px;
& > img {
width: 100%;
height: 100%;
border-radius: 22px;
}
}
.msg-item-detail {
display: flex;
flex-direction: column;
text-align: left;
font-size: 13px;
& > :first-child {
color: #999999;
margin-bottom: 8px;
}
.send-warpper {
display: flex;
flex-direction: row;
align-items: center;
& > .icon {
width: 20px;
height: 20px;
margin-right: 10px;
}
.mid-text-wrapper {
display: flex;
flex-direction: row;
align-items: center;
& > img {
width: 18px;
height: 18px;
margin-right: 8px;
cursor: pointer;
}
}
.mid-text {
padding: 12px 16px;
display: inline-block;
max-width: 520px;
border-radius: 8px;
background: #ebf5fc;
text-align: justify;
color: #333333;
&.no-support {
display: flex;
align-items: center;
& > img {
width: 14px;
height: 14px;
margin-right: 3px;
}
}
}
.link {
color: #2f86f6;
}
& > .mid-pdf {
width: 260px;
display: flex;
flex-direction: row;
justify-content: space-between;
text-align: left;
padding: 10px 15px;
background: #f0f1f2;
border-radius: 8px;
min-height: 80px;
cursor: pointer;
.midp-left {
display: flex;
flex-direction: column;
justify-content: space-around;
margin-right: 10px;
.name {
font-size: 13px;
color: #333333;
word-break: break-word;
}
.size {
font-size: 12px;
color: #999999;
}
}
.midp-icon {
width: 36px;
height: 44px;
& > img {
width: 36px;
height: 100%;
border-radius: 3px;
}
}
}
& > .mid-img {
display: flex;
flex-direction: row;
align-items: center;
cursor: pointer;
// & > .icon {
// width: 20px;
// height: 20px;
// }
// & > .img {
// width: 170px;
// height: 108px;
// border-radius: 8px;
// }
.img-box {
max-width: 192px;
max-height: 320px;
overflow: hidden;
}
}
}
}
&.cr {
flex-direction: row-reverse;
.msg-item-img {
margin-right: 0;
margin-left: 8px;
}
.msg-item-detail {
text-align: right;
& > .mid-text {
background: #f0f1f2;
}
}
}
}
.split-line {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
margin: 15px 0;
font-size: 14px;
color: #999999;
&::before {
flex: 1;
content: '';
height: 1px;
margin-right: 18px;
background: #f0f1f2;
}
&::after {
flex: 1;
content: '';
height: 1px;
margin-left: 18px;
background: #f0f1f2;
}
}
.error-mg {
display: inline-block;
max-width: 520px;
// height: 24px;
max-width: 520px;
line-height: 16px;
text-align: left;
border-radius: 20px;
opacity: 0.45;
margin: -2px 0 10px;
padding: 4px 12px;
color: #FFFFFF;
background: #000000;
margin-left: 50px;
&.mr {
margin-left: 0;
margin-right: 50px;
}
}
}
.c-bottom {
position: relative;
top: -8px;
left: 0;
display: flex;
flex-direction: row;
margin: 16px 12px 16px 25px;
.cb-icon-wrapper {
position: absolute;
top: 0;
right: 70px;
display: flex;
align-items: center;
height: 44px;
img {
width: 20px;
height: 20px;
margin-right: 16px;
cursor: pointer;
}
}
.send-btn {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 60px;
height: 44px;
background: #f3f6f7;
margin-left: 12px;
border-radius: 8px;
cursor: pointer;
& > img {
width: 24px;
height: 24px;
}
&.active {
background: #0d9078;
}
}
}
&.no-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
img {
display: block;
width: 120px;
height: 100px;
}
p {
margin-top: 10px;
font-size: 14px;
color: rgba(0, 0, 0, 0.65);
}
}
}
.right {
width: 240px;
border-left: 2px solid #f5f5f5;
overflow: scroll;
}
background: #fff;
.time {
color: #999999;
}
.small {
font-size: 12px;
}
.ld{
-webkit-transition-property: -webkit-transform;
-webkit-transition-duration: 1s;
-moz-transition-property: -moz-transform;
-moz-transition-duration: 1s;
-webkit-animation: rotate 3s linear infinite;
-moz-animation: rotate 3s linear infinite;
-o-animation: rotate 3s linear infinite;
animation: rotate 3s linear infinite;
}
@-webkit-keyframes rotate{from{-webkit-transform: rotate(0deg)}
to{-webkit-transform: rotate(360deg)}
}
@-moz-keyframes rotate{from{-moz-transform: rotate(0deg)}
to{-moz-transform: rotate(359deg)}
}
@-o-keyframes rotate{from{-o-transform: rotate(0deg)}
to{-o-transform: rotate(359deg)}
}
@keyframes rotate{from{transform: rotate(0deg)}
to{transform: rotate(359deg)}
}
}
}
\ No newline at end of file
src/views/IM/current-session/index.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="current-session-wrap">
<!-- <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb> -->
<section class="component-content screenSet" id="screenSet">
<article class="left">
<div class="l-header">
<span>我的任务({{this.sessionListData.myTaskCount}})</span>
<p @click="fetchOneTask">
<img src="../../../assets/image/IM/plus-task.png" />
<span>再来一个</span>
</p>
</div>
<p class="c-num">当前等待会话：{{this.sessionListData.waitingTaskCount}}个</p>
<!-- <ul id="sessionListId" class="session-list" :style="{'height': containerHeight + 'px'}"> -->
<ul id="sessionListId" class="session-list">
<li
class="item"
:class="{'current': currentTaskLogId == session.taskLogId}"
v-for="(session, index) in sessionListData.sessionList"
:key="index"
@click="selectSession(session, index)"
>
<div class="img-wrapper">
<img :src="session.avatarImageUrl" alt />
</div>
<div class="desc">
<div class="top">
<span class="name">{{session.toName}}</span>
<span class="time small">{{session.timestampStr}}</span>
</div>
<div class="bottom">
<span>{{session.text | shortName}}</span>
<!-- <span>{{session.lastMsgContent}}</span> -->
<span
v-show="session.status !=3 && currentTaskLogId != session.taskLogId && session.unreadCount"
class="num"
>{{session.unreadCount}}</span>
<img
v-show="session.status == 3"
src="../../../assets/image/IM/icon-exit.png"
@click.stop="closeOneTask(session)"
/>
</div>
</div>
</li>
</ul>
</article>
<article
v-show="sessionListData.sessionList.length"
class="center"
v-loadmore="getOldMSGHistory"
>
<section class="c-header">
<div class="c-header-l">
<img :src="currentSession.avatarImageUrl" alt />
<span class="name">{{doctorInfo.name}}</span>
<span class="time-tip">当前会话时长：{{currentContinueTimes | continueTimesFilter}}</span>
</div>
<!-- <span class="close-btn">结束会话</span> -->
</section>
<p class="refreshText"></p>
<!-- <section
id="msgContentId"
class="msg-content scroll-box"
:style="{'height': (containerHeight - 35) + 'px'}"
>-->
<section id="msgContentId" class="msg-content scroll-box">
<article
v-for="(item, index) in messageList"
:key="index"
:style="{'text-align': item.sendOrReceive ? 'right' : 'left'}"
>
<div class="split-line" v-if="item.sessionFlag">本次会话结束</div>
<div class="msg-item" :class="{'cr': item.sendOrReceive}">
<div class="msg-item-img">
<img :src="item.avatarImg" alt />
</div>
<div class="msg-item-detail">
<span class="mid-time">{{item.timestampStr}}</span>
<div class="send-warpper">
<img
v-if="item.sendOrReceive && item.isShowErrorIcon"
class="icon"
src="../../../assets/image/IM/icon-no-send.png"
alt
/>
<img
v-if="item.sendOrReceive && item.isShowLoadingIcon"
class="icon ld"
src="../../../assets/image/IM/loading-icon-new.png"
alt
/>
<div v-if="item.showType == 1" class="mid-text-wrapper" style="max-width: 520px;">
<!-- <img v-show="item.sendFlag" src="../../../assets/image/IM/icon-no-send.png" alt /> -->
<div class="mid-text">{{item.text}}</div>
</div>
<div v-if="item.showType == 2" class="mid-img" v-viewer>
<div class="img-box">
<img
class="img"
:src="item.url"
:style="{width: item.newW + 'px', height: item.newH + 'px' }"
alt
/>
</div>
</div>
<div v-if="item.showType == 3" class="mid-pdf" @click="openPDF(item)">
<div class="midp-left">
<span class="name">{{item.text | shortName(23)}}</span>
<span class="size">{{fileSizeChange(item.size)}}</span>
</div>
<div class="midp-icon">
<img src="../../../assets/image/IM/icon-pdf.png" alt />
</div>
</div>
<div v-if="item.showType == 4" class="mid-text">
{{item.text}}
<span class="link">{{item.suffix}}</span>
</div>
<div v-if="item.showType == 5" class="mid-text no-support">
<img src="../../../assets/image/IM/icon-warning-circle.png" alt />
<span>该消息类型PC端暂不支持</span>
</div>
</div>
</div>
</div>
<span
v-if="item.sendOrReceive && item.isShowErrorMsg"
class="error-mg"
:class="{'mr': item.sendOrReceive}"
>{{item.errorMsg}}</span>
</article>
</section>
<section class="c-bottom">
<el-input type="textarea" placeholder="请输入内容" v-model="sendText" maxlength="499"></el-input>
<div class="cb-icon-wrapper">
<el-upload
class="bg-uploader"
action="#"
accept=".jpg, .png, .pdf"
:show-file-list="false"
:before-upload="beforeUploadFile"
>
<img src="../../../assets/image/IM/icon-folder-open.png" alt />
</el-upload>
<img src="../../../assets/image/IM/icon-link.png" @click="preSendLinkMsg" alt />
</div>
<div class="send-btn" :class="{'active': canSend}" @click="sendTextMsg">
<img v-show="canSend" src="../../../assets/image/IM/send-yes.png" alt />
<img v-show="!canSend" src="../../../assets/image/IM/send-no.png" alt />
</div>
</section>
</article>
<article id="userInfoId" v-show="sessionListData.sessionList.length" class="right">
<UserInfo :userInfo="doctorInfo" :taskLogId="currentTaskLogId"></UserInfo>
</article>
<article v-show="!sessionListData.sessionList.length" class="center no-content">
<img src="../../../assets/image/IM/no-search-list.png" alt />
<p>任务都做完啦！休息一下吧～</p>
</article>
</section>
<!-- 选择链接弹窗 -->
<el-dialog
title="选择链接"
:show-close="true"
:visible.sync="showSelectDialog"
:close-on-click-modal="false"
width="500px"
class="link-form"
>
<el-form ref="linkFormRef" :rules="rules" :model="linkForm" label-width="100px">
<el-form-item label="普通文本">
<el-col :span="20">
<el-input v-model="linkForm.remark" size="small" maxlength="300"></el-input>
</el-col>
</el-form-item>
<el-form-item label="链接文案" prop="info">
<el-col :span="20">
<el-input v-model="linkForm.info" size="small" maxlength="100"></el-input>
</el-col>
</el-form-item>
<el-form-item label="链接地址" prop="url">
<el-col :span="20">
<el-select
size="small"
style="width: 300px"
clearable
filterable
v-model="linkForm.url"
placeholder="请选择"
>
<el-option
v-for="item in linkList"
:key="item.id"
:label="item.title"
:value="item.id"
></el-option>
</el-select>
</el-col>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: right;">
<el-button size="small" @click="showSelectDialog = false">取 消</el-button>
<el-button size="small" type="primary" @click="sendLinkMsg">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { mapGetters, mapMutations } from "vuex";
import BreadCrumb from "@/components/breadcrumb.vue";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { validateWord } from "@/utils/validate.js";
import { openLoading, closeLoading, betaHandle } from "@/utils/utils";
import { getPicaKFAccid, getPhomeDemain } from "@/utils";
import UserInfo from "@/components/IM/user-info.vue";
const CONTAINER_HEIGHT = 700;
let forwardMsgIntervalId = null,
sessionIntervalId = null,
continueIntervalId = null,
autoCompletionIntervalId = null,
cacheMap = {};
let _this = null;
export default {
components: {
BreadCrumb,
UserInfo,
},
data() {
return {
curmbFirst: "云鹊客服",
curmbSecond: "当前会话",
sendText: "",
sessionListData: {
currentTimestamp: 0,
myTaskCount: 0,
sessionList: [],
waitingTaskCount: 0
},
currentContinueTimes: 0,
currentSessionIndex: 0, // 当前会话序号
currentSession: {},
currentTaskLogId: "", // 当前会话ID
currentToAccId: "",
picakfAccId: "",
historyTimestamp: 0,
realTimestamp: 0,
doctorInfo: {
name: "",
mobilePhone: "",
isShowCopyBtn: true
},
containerHeight: CONTAINER_HEIGHT,
showSelectDialog: false,
linkForm: {
remark: "",
info: "",
url: ""
},
linkList: [],
// 消息列表 showType 1: 文本; 2: 图片; 3: PDF; 4: 链接; 5: 不支持类型;
messageList: [],
rules: {
info: [
{ required: true, message: "请填写链接显示文案", trigger: "blur" }
],
url: [{ required: true, message: "请选择链接", trigger: "change" }]
},
imgWidth: 0,
imgHeight: 0,
imgProportion: 0,
hasNoHistoryData: false,
};
},
computed: {
...mapGetters(["isFromAssignTask"]),
canSend() {
return !!this.sendText;
}
},
watch: {
// 监听消息列表的变化，添加sessionFlag(会话结束标志)
messageList: {
handler(newMsgList) {
let l = newMsgList.length;
if (l >= 2) {
for (let i = 1; i < l; i++) {
if (newMsgList[i - 1].taskLogId !== newMsgList[i].taskLogId) {
newMsgList[i].sessionFlag = true;
}
}
}
},
deep: true
},
// 监听到有变化，就缓存一下
sendText(newText) {
cacheMap[this.currentSession.id] = newText || "";
}
},
created() {
_this = this;
this.picakfAccId = getPicaKFAccid();
this.kfAvatar = require("../../../assets/image/IM/kf-avatar.png");
this.getSessionList();
sessionIntervalId && clearInterval(sessionIntervalId);
sessionIntervalId = setInterval(() => {
this.getSessionList();
}, 3000);
this.getFiveContentList();
autoCompletionIntervalId && clearInterval(autoCompletionIntervalId);
autoCompletionIntervalId = setInterval(() => {
this.autoCompletionInterval();
}, 2000);
// 监听键盘的回车按键（回车时发送消息，并阻止其在textarea中的回车换行行为）
document.onkeydown = function(ev) {
var event = ev || event;
if (event.keyCode == 13) {
_this.sendTextMsg();
event.preventDefault();
}
};
},
mounted() {
cacheMap = {};
this.$nextTick(() => {
_this.containerHeight = document.body.clientHeight - 80;
_this.getElmByID("screenSet").style.height =
_this.containerHeight - 76 + "px";
// console.log('_this.containerHeight', _this.containerHeight);
_this.getElmByID("sessionListId").style.height =
_this.containerHeight - 176 + "px";
_this.getElmByID("userInfoId").style.height =
_this.containerHeight - 76 + "px";
_this.getElmByID("msgContentId").style.height =
_this.containerHeight - 211 + "px";
});
},
methods: {
//
...mapMutations(["SET_IS_FROM_ASSIGN_TASK"]),
// 含有敏感信息的消息，自行补全提示文案
// 每30秒监测敏感信息
autoCompletionInterval() {
if (!this.messageList) return;
// console.log('in autoCompletionInterval');
// 将带有loading的消息转成失败的
this.messageList.forEach(item => {
if (item.isShowLoadingIcon) {
item.isShowLoadingIcon = false;
item.isShowErrorIcon = true;
}
});
let flag = false,
msg;
for (let i = 0; i < this.messageList.length; i++) {
msg = this.messageList[i];
if (msg.isShowErrorIcon && !msg.isShowErrorMsg) {
flag = true;
break;
}
}
if (flag) {
this.getMSGForwardForAC(msg);
}
},
// 查询医生和居民的消息 - 向前查找
getMSGForwardForAC(msg) {
let session = this.currentSession;
let params = {
doctorAccId: this.currentToAccId,
includeFlag: 0,
lastClientIdServer: session.lastMsgIdClient,
lastMsgIdServer: session.lastMsgIdServer,
lastMsgTimestamp: msg.realTimestamp,
limit: 50,
patientAccId: this.picakfAccId,
unionId: ""
};
this.POST("/im/msg/forward", params).then(res => {
if (res.code === "000000") {
this.contactForwardMessage(res.data, false);
}
});
},
// 获取元素
getElmByID(elmId) {
return document.getElementById(elmId);
},
// 处理发送消息
// 1: 先将消息体直接显示在对话框中
// 2: 设置一个时间戳，以便再次找回
// 3: 保存再次发送的数据
// 4: 设置各种状态（1:isShowErrorIcon; 2:isShowLoadingIcon; 3:isShowErrorMsg）
handleSendMsg(params, sendId) {
let text = "";
let msg = Object.assign({}, params);
msg.fromAccount = this.currentToAccId;
msg.toAccount = this.picakfAccId;
// type: 0, // 类型 0文本 1图片 2pdf 3链接
msg.text = params.info || "";
msg.suffix = params.remark || "";
if (msg.type == 3) {
msg.suffix = params.info;
msg.text = params.remark || "";
}
msg.size = params.fileSize;
msg.url = params.url;
msg.showType = params.type - 0 + 1;
msg.sessionFlag = false;
msg.isShowLoadingIcon = true;
msg.isShowErrorIcon = false;
msg.isShowErrorMsg = false; // 只有在下次拉取新数据时才有可能是为ture
msg.extData = Object.assign({}, params); // 再将发送时的数据
msg.sendId = sendId; //
msg.sendOrReceive = true;
msg.avatarImg = this.kfAvatar;
msg.timestampStr = new Date().format("hh:mm");
msg.realTimestamp = this.realTimestamp;
msg.taskLogId = this.currentTaskLogId;
console.log("####msg####", msg);
//
if(msg.type == 1) {
this.imgSizeHandleNew(msg, msg.width, msg.height);
}
this.messageList.push(msg);
this.$nextTick(() => {
var element = document.querySelector(".scroll-box");
element.scrollTop = element.scrollHeight;
});
},
// 查询医生和居民的消息历史(下拉刷新时调用)
getOldMSGHistory() {
console.log('this.hasNoHistoryData', this.hasNoHistoryData);
if(this.hasNoHistoryData) return;
let session = this.currentSession;
let params = {
doctorAccId: this.currentToAccId,
includeFlag: 0, // 不带本条消息
lastClientIdServer: session.lastMsgIdClient,
lastMsgIdServer: session.lastMsgIdServer,
lastMsgTimestamp: this.historyTimestamp,
limit: 20,
patientAccId: this.picakfAccId,
unionId: ""
};
this.POST("/im/msg/history", params).then(res => {
if (res.code === "000000") {
// 将新消息合并到之前的消息中, 并且重置最后一条消息
if(res.data && res.data.length > 0) {
this.convertMessageList(res.data, 3);
} else {
this.hasNoHistoryData = true;
}
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 查询医生和居民的消息历史(第一次进来时就调用)
getMSGHistory(session) {
let params = {
doctorAccId: this.currentToAccId,
includeFlag: 1, // 带本条消息
lastClientIdServer: session.lastMsgIdClient,
lastMsgIdServer: session.lastMsgIdServer,
lastMsgTimestamp: session.lastMsgTime,
limit: 20,
patientAccId: this.picakfAccId,
unionId: ""
};
this.POST("/im/msg/history", params).then(res => {
if (res.code === "000000") {
this.convertMessageList(res.data, 1);
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 查询医生和居民的消息 - 向前查找
// 将获取消息列表插入到当前消息列表的最后
getMSGForward() {
let session = this.currentSession;
let params = {
doctorAccId: this.currentToAccId,
includeFlag: 0,
lastClientIdServer: session.lastMsgIdClient,
lastMsgIdServer: session.lastMsgIdServer,
lastMsgTimestamp: this.realTimestamp,
limit: 20,
patientAccId: this.picakfAccId,
unionId: ""
};
this.POST("/im/msg/forward", params).then(res => {
if (res.code === "000000") {
this.convertMessageList(res.data, 2);
if (res.data.length) {
this.readAllMsg();
}
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 转换消息格式
// 处理的消息类型只有5种：
// type == TEXT(showType:1)
// type == image 或 picture(showType:2)
// type == custom时，18: PDF文件(showType:3); 19: 链接信息(showType:4); 1 ~ 17: 不支持的消息类型(showType:5);
// directFlag 1: 第一次取数据; 2: 拼接实时消息(push); 3: 拼接历史消息(unshift);
convertMessageList(messageList, directFlag = 1) {
messageList.sort((a, b) => {
return a.timestamp - b.timestamp;
});
let msg = null,
content = null,
text = "",
suffix = "",
showType = 1,
size = 0,
url = "",
cMessageList = [];
messageList.forEach((rawMsg, index) => {
text = "";
suffix = "";
showType = 1;
size = 0;
url = "";
msg = Object.assign({}, rawMsg);
msg.sendOrReceive = rawMsg.fromAccId !== this.currentToAccId;
msg.avatarImg = msg.sendOrReceive
? this.kfAvatar
: this.currentSession.avatarImageUrl;
if (msg.type.toLowerCase() == "custom") {
content = JSON.parse(msg.content);
text = content.content;
// 系统消息：消息由于违规未发送成功（可以不处理）
if (content.bizType == -1) {
showType = -1;
text = content.content;
} else if (content.bizType == 18) {
showType = 3;
text = content.name;
size = content.size;
url = content.url;
} else if (content.bizType == 19) {
showType = 4;
text = content.content;
suffix = content.suffix;
} else {
showType = 5;
}
} else if (
msg.type.toLowerCase() == "image" ||
msg.type.toLowerCase() == "picture"
) {
content = JSON.parse(msg.content);
url = content.url;
text = content.name;
showType = 2;
this.imgSizeHandleNew(msg, content.w, content.h);
} else {
showType = 1;
text = msg.content;
}
msg.text = text;
msg.showType = showType;
msg.suffix = suffix;
msg.size = size;
msg.url = url;
msg.sessionFlag = false;
cMessageList.push(msg);
});
if (directFlag === 1) {
this.messageList = [];
this.$forceUpdate();
forwardMsgIntervalId && clearInterval(forwardMsgIntervalId);
this.messageList = cMessageList;
this.$forceUpdate();
setTimeout(() => {
this.$nextTick(() => {
const scrollBoxDom = document.querySelector(".scroll-box");
scrollBoxDom.scrollTop = scrollBoxDom.scrollHeight;
});
}, 100);
this.currentContinueTimes =
this.sessionListData.currentTimestamp -
this.currentSession.handleStartTime;
continueIntervalId && clearInterval(continueIntervalId);
continueIntervalId = setInterval(() => {
this.currentContinueTimes += 1000;
}, 1000);
// 最新消息，要合并CUSTOM类型中，bizType是-1的数据（系统消息）
} else if (directFlag === 2) {
this.contactForwardMessage(cMessageList);
} else {
if (cMessageList.length) {
this.messageList.unshift(...cMessageList);
this.$nextTick(() => {
const scrollBoxDom = document.querySelector(".scroll-box");
scrollBoxDom.scrollTop = 1000;
});
}
}
// 重新设置历史与实时的时间戳
if (this.messageList.length) {
this.historyTimestamp = this.messageList[0].timestamp;
let timestamp = this.messageList[this.messageList.length - 1].timestamp;
if (timestamp) {
this.realTimestamp = timestamp;
}
}
// 自己发送消息时，暂时不刷新消息
if (directFlag == 1) {
forwardMsgIntervalId = setInterval(() => {
this.getMSGForward();
}, 3000);
}
this.$forceUpdate();
},
// 接接数据
contactForwardMessage(cMessageList, canPush = true) {
let content = {},
signature = "",
msgIndex = -1,
newMsgList = [],
flag = false;
cMessageList.forEach(item => {
content = {};
signature = "";
msgIndex = -1;
newMsgList = [];
if (item.type.toLowerCase() == "custom") {
content = JSON.parse(item.content);
if (content.bizType == -1) {
signature = content.signature;
msgIndex = this.messageList.findIndex(m => {
return m.signature == signature && !m.isShowErrorMsg;
});
if (msgIndex > -1) {
flag = true;
this.messageList[msgIndex].errorMsg = content.content;
this.messageList[msgIndex].isShowErrorMsg = true;
}
this.$forceUpdate();
} else {
flag = true;
canPush && this.messageList.push(item);
}
} else {
flag = true;
canPush && this.messageList.push(item);
}
});
if (flag) {
this.$nextTick(() => {
var element = document.querySelector(".scroll-box");
if (
element.scrollTop >=
element.scrollHeight - element.offsetHeight - 300
) {
element.scrollTop = element.scrollHeight - element.offsetHeight;
}
});
}
},
// 选择一个会话
selectSession(session, index) {
// 点击当前的，不再重新请求数据
if (this.currentTaskLogId == session.taskLogId) return;
this.hasNoHistoryData = false;
this.currentTaskLogId = session.taskLogId;
this.currentToAccId = session.toAccId;
this.currentSession = session;
this.currentSessionIndex = index;
this.sendText = cacheMap[this.currentSession.id];
// 获取当前消息列表（最新的历史消息）
this.getMSGHistory(this.currentSession);
// 获取医生信息
this.getDoctorInfo(this.currentToAccId);
// 调用全部已读
if (session.unreadCount) {
this.readAllMsg();
}
},
// 打开PDF
openPDF(item) {
window.open(item.url, "__blank");
},
// 给我一个任务吧，如果当前没有任务，则要提示
fetchOneTask() {
this.GET("/im/session/kf/fetchOneTask").then(res => {
if (res.code === "000000") {
this.SET_IS_FROM_ASSIGN_TASK(true);
this.currentTaskLogId = "";
this.getSessionList();
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 获取会话列表
getSessionList() {
this.GET("/im/session/kf/list").then(res => {
if (res.code === "000000") {
this.sessionListData = res.data || {
currentTimestamp: 0,
myTaskCount: 0,
sessionList: [],
waitingTaskCount: 0
};
let sLength = this.sessionListData.sessionList.length;
let cIndex = sLength - 1;
if (!this.isFromAssignTask) {
this.SET_IS_FROM_ASSIGN_TASK(false);
cIndex = 0;
}
// 第一次进入页面
if (sLength && !this.currentTaskLogId) {
// this.currentSession = this.sessionListData.sessionList[0];
// this.currentSessionIndex = 0;
this.currentSession = this.sessionListData.sessionList[cIndex];
this.currentSessionIndex = cIndex;
this.sendText = cacheMap[this.currentSession.id];
this.currentTaskLogId = this.currentSession.taskLogId;
this.currentToAccId = this.currentSession.toAccId;
this.getDoctorInfo(this.currentToAccId);
this.getMSGHistory(this.currentSession);
this.readAllMsg();
// 如果是点击“再来一个”或“给我一个任务吧”按钮分配的任务，则要滚动到最后
if (this.isFromAssignTask) {
this.$nextTick(() => {
let element = this.getElmByID("sessionListId");
if (element) {
element.scrollTop = element.scrollHeight;
}
});
}
}
if (sLength) {
this.convertSessions(this.sessionListData.sessionList);
this.$forceUpdate();
}
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 将会话列表的数据进行处理，主要是显示文本（text）字段
convertSessions(sessions) {
let convertSessionList = [];
let text = "",
cc;
sessions.forEach((session, index) => {
if (session.lastMsgType.toLowerCase() == "custom") {
cc = JSON.parse(session.lastMsgContent);
text = cc.suffix || cc.content || cc.title || cc.name;
} else if (
session.lastMsgType.toLowerCase() == "image" ||
session.lastMsgType.toLowerCase() == "picture"
) {
text = "[图片]";
} else {
text = session.lastMsgContent;
}
session.text = text;
convertSessionList.push(session);
});
this.sessionListData.sessionList = convertSessionList;
},
// 根据云信id获取医生信息
getDoctorInfo(accId) {
this.GET(`/im/account/accid/doctorinfo?accId=${accId}`).then(res => {
if (res.code === "000000") {
this.doctorInfo = res.data || {};
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 关闭一个任务
closeOneTask(session) {
let params = {
taskLogId: session.taskLogId
};
this.POST(`/im/session/kf/closeOneTask`, params).then(res => {
if (res.code === "000000") {
if (res.data == 1) {
this.currentTaskLogId = "";
this.getSessionList();
}
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 设置全部消息已读
readAllMsg() {
let fromAccount = this.currentToAccId,
toAccount = this.picakfAccId;
let params = {
fromAccount,
toAccount
};
this.POST(`/im/msg/read/all`, params).then(res => {
if (res.code === "000000") {
this.currentSession.unreadCount = 0;
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 根据字段名及其值，从数组中查找对象
findItemByKeyAndVal(arr, key, value, flag = 0) {
if (flag == 0) {
return arr.find(item => {
return item[key] == value;
});
} else if (flag == 1) {
return arr.findIndex(item => {
return item[key] == value;
});
}
},
// 获取积木列表
getFiveContentList() {
this.GET(
"/contents/admin/template/queryTemplate?publishFlag=5&pageNo=1&pageSize=99999"
).then(res => {
if (res.code === "000000") {
this.linkList = res.data.templateList || [];
} else {
this.$message({
message: res.message,
type: "error"
});
}
});
},
// 上传文件
beforeUploadFile(file) {
console.log("file", file);
let fileSize = file.size / (1024 * 1024);
if (fileSize > 5) {
this.$message({
message: "请上传小于5M的文件",
type: "warning"
});
return;
}
openLoading(_this);
doUpload(
_this,
file,
getFilePath(file, null),
"preview4",
"progress",
""
).then(function(resData) {
closeLoading(_this);
let params = {};
params.fileSize = resData.size;
params.fileExt = resData.ext;
params.url = resData.fullPath;
params.info = resData.name;
params.type = 2;
// 如果是图片，则要获取其宽与高
if (
params.fileExt.toLowerCase() === ".jpg" ||
params.fileExt.toLowerCase() === ".jpeg" ||
params.fileExt.toLowerCase() === ".png"
) {
params.type = 1;
let image = new Image();
image.src = params.url;
image.onload = function() {
let _img = this;
params.width = _img.width;
params.height = _img.height;
_this.sendCommonMsg(params);
};
} else {
_this.sendCommonMsg(params);
}
});
},
// 打开发送链接弹框
preSendLinkMsg() {
this.linkForm = {
remark: "",
info: "",
url: ""
};
this.showSelectDialog = true;
},
// 发送带链接消息
sendLinkMsg() {
this.$refs["linkFormRef"].validate(valid => {
if (valid) {
let params = Object.assign({}, this.linkForm);
params.url = getPhomeDemain() + `/template_v2/?id=${params.url}`;
params.type = 3;
this.sendCommonMsg(params);
this.showSelectDialog = false;
}
});
},
// 发送文本消息
sendTextMsg() {
if (!this.canSend) return;
this.sendCommonMsg({ info: this.sendText });
this.sendText = "";
},
// 发送通用消息
async sendCommonMsg(params) {
let sendMsgParams = {
fromAccount: this.picakfAccId,
toAccount: this.currentToAccId,
fileExt: "", // 文件扩展名称图片或PDF文件）
fileSize: 0, // 文件大小（图片或PDF文件）
height: 0, // 图片高度（仅图片）
width: 0, // 图片宽度（仅图片）
info: "", // 文本内容，图片的名称，pdf的名称，链接显示内容
md5: "", // 图片或文件MD5 暂时由后台生成
remark: "", // 其他信息（链接中的前缀文案）
type: 0, // 类型 0文本 1图片 2pdf 3链接
url: "" // url地址（图片、pdf，链接）
};
params = Object.assign(sendMsgParams, params);
// 将获取新数据的定时器关闭
forwardMsgIntervalId && clearInterval(forwardMsgIntervalId);
let sendId = new Date().getTime();
this.handleSendMsg(params, sendId);
// console.log("sendMsgParams", params);
await this.POST("/im/msg/sendMessage", params)
.then(res => {
if (res.code === "000000") {
// 校验结果：1校验通过 2校验不通过
// console.log(res.data.checkFlag);
let msg = this.messageList[this.messageList.length - 1];
if (msg.sendId !== sendId) {
msg = this.getMsgBySendId(sendId);
}
if (res.data.checkFlag == 1) {
this.realTimestamp = res.data.timetag;
msg.isShowLoadingIcon = false;
msg.isShowErrorIcon = false;
msg.isShowErrorMsg = false; // 只有在下次拉取新数据时才有可能是为ture
} else {
msg.signature = res.data.signature;
msg.isShowLoadingIcon = false;
msg.isShowErrorIcon = true;
msg.isShowErrorMsg = false; // 只有在下次拉取新数据时才有可能是为ture
}
} else {
this.$message({
message: res.message,
type: "error"
});
}
})
.catch(error => {
let msg = this.messageList[this.messageList.length - 1];
if (msg.sendId !== sendId) {
msg = this.getMsgBySendId(sendId);
}
msg.isShowLoadingIcon = false;
msg.isShowErrorIcon = true;
msg.isShowErrorMsg = false; // 只有在下次拉取新数据时才有可能是为ture
msg.canRepeatSend = true;
});
this.$forceUpdate();
// 重新开启定时器
forwardMsgIntervalId = setInterval(() => {
this.getMSGForward();
}, 3000);
},
// 根据sendId，查找到对应的消息
getMsgBySendId(sendId) {
console.log("------------getMsgBySendId------------");
let l = this.messageList.length,
i = l - 1;
for (; i > 0; i--) {
if (this.messageList[i].sendId == sendId) {
break;
}
}
return this.messageList[i];
},
// 文件大小单位转换
fileSizeChange(val) {
return betaHandle(val);
},
},
beforeDestroy() {
sessionIntervalId && clearInterval(sessionIntervalId);
forwardMsgIntervalId && clearInterval(forwardMsgIntervalId);
autoCompletionIntervalId && clearInterval(autoCompletionIntervalId);
}
};
</script>
<style lang="scss" scoped>
@import "./index.scss";
</style>
\ No newline at end of file
src/views/IM/diagnosis-admin/diagnosis-list.vue
浏览文件 @ 254805e1
......@@ -333,7 +333,7 @@ export default {
},
// 加入问诊
jionCommunicate(row) {
this.$router.push({path: '/diagnosis-live', query: {tid: row.imTeamId}})
this.$router.push({path: '/diagnosis-live', query: {tid: row.imTeamId, diagnoseLogId: row.diagnoseLogId}})
},
// 发送消息
sendMessage(row) {
......
src/views/IM/search-message/detail.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="search-msg-detail">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :jumPathThird="jumPathThird"></bread-crumb>
<div class="detail-content">
<div id="scroll-set">
<div class="item-content" v-for="(item, index) in detailData" :key="index">
<div class="split-line" v-if="item.sessionFlag">本次会话结束</div>
<div v-if="item.content.bizType != -1" class="msg-container" :class="{'has-line': !item.sessionFlag}">
<div class="msg-item-img">
<img v-if="item.fromAccId == picakfAccId" src="../../../assets/image/IM/kf-avatar.png" alt />
<img v-else :src="userAvatar" />
</div>
<div class="msg-content">
<div class="info">
<span v-if="item.fromAccId == picakfAccId">客服</span>
<span v-else>{{userName}}</span>
<span class="mid-time">{{item.timestamp}}</span>
</div>
<div v-if="item.type == 'TEXT'" class="text-content">
<div>{{item.content}}</div>
</div>
<div v-if="item.type == 'PICTURE'" class="img-content" v-viewer>
<div class="img-box">
<img :src="item.content.url" :style="{width: item.newW + 'px', height: item.newH + 'px'}"/>
</div>
</div>
<div v-if="item.type == 'CUSTOM'">
<div v-if="item.content.bizType == 18" class="file-content">
<div class="file-con" @click="downPDF(item.content.url)">
<div class="file-left">
<span class="name">{{item.content.name | shortName(23)}}</span>
<span class="size">{{fileSizeChange(item.content.size)}}</span>
</div>
<div class="file-right">
<img src="../../../assets/image/IM/icon-pdf.png" alt />
</div>
</div>
</div>
<div v-if="item.content.bizType == 19" class="link-content">
<div>{{item.content.content}}<span class="link-text">{{item.content.suffix}}</span></div>
</div>
<div v-if="item.content.bizType != -1 && item.content.bizType != 19 && item.content.bizType != 18" class="text-content pc-no-support">
<img src="../../../assets/image/IM/icon-warning-circle.png" alt />
<span>该消息类型PC端暂不支持</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { openLoading, closeLoading, betaHandle, timeHandle } from "@/utils/utils";
import { getPicaKFAccid } from "@/utils";
export default {
components: {
BreadCrumb,
},
data() {
return {
// hasSearchDate: false,
jumPathThird: '/search-message-list',
curmbFirst:'消息查询',
curmbSecond:'消息详情',
picakfAccId: '',
lastMsgTime: '',
doctorAccId: '',
detailData: [],
userAvatar: '',
userName: '',
scroll: true,
ele: '',
topFlag: false,
hasHistoryData: true,
historyTime: '',
hasForwardData: true,
};
},
created() {
// this.hasSearchDate = this.$route.query.hasSearchDate;
this.historyTime = this.$route.query.msgTimestamp;
this.doctorAccId = this.$route.query.doctorAccId;
this.userAvatar = this.$route.query.avatarImageUrl;
this.userName = this.$route.query.userName;
this.picakfAccId = getPicaKFAccid();
},
mounted() {
// this.getDeatailData(1);
this.getHistoryData(1);
let _this = this;
setTimeout(() => {
let el = _this.getElmByID('scroll-set');
// _this.containerHeight = _this.getElmByID('slidebar-container').getBoundingClientRect().height - 15;
_this.containerHeight = document.body.clientHeight - 80;
_this.getElmByID('scroll-set').style.height = _this.containerHeight - 152 + "px";
// if(_this.hasSearchDate) { // 有查询日期 滚动条最顶部
// el.scrollTop = 10;
// }else { // 没有查询日期 滚动条最底部
// el.scrollTop = el.scrollHeight;
// }
el.scrollTop = el.scrollHeight;
let flag = true, timeoutId = null, downflag = true, downtimeoutId = null;
el.addEventListener('scroll', function() {
let allH, sh;
allH = el.scrollTop + el.clientHeight;
sh = el.scrollHeight;
if(el.scrollTop < 1 && _this.hasHistoryData) {
if(flag) {
flag = false;
timeoutId && clearTimeout(timeoutId);
timeoutId = setTimeout( () => {
_this.getHistoryData(0);
flag = true;
}, 150)
}
}
// if((sh - allH < 1) && _this.hasForwardData) {
// if(downflag) {
// downflag = false;
// downtimeoutId && clearTimeout(downtimeoutId);
// downtimeoutId = setTimeout( () => {
// _this.getDeatailData(0);
// downflag = true;
// }, 150)
// }
// }
})
},100);
},
methods: {
// 获取元素
getElmByID(elmId) {
return document.getElementById(elmId);
},
// 获取详情数据以及下拉加载历史数据
// getDeatailData(param) { // 最新的时间在最后面
// let url = '/im/msg/forward';
// let req = {
// doctorAccId: this.doctorAccId,
// includeFlag: param, // 第一次加载是1 上翻历史是0
// lastMsgTimestamp: this.lastMsgTime,
// limit: 20,
// patientAccId: this.picakfAccId,
// unionId: ""
// }
// this.POST(url, req).then((res) => {
// if(res.code == '000000') {
// let arr = [];
// if(res.data.length > 0) {
// this.hasForwardData = true;
// this.historyTime = res.data[0].timestamp;
// this.lastMsgTime = res.data[res.data.length - 1].timestamp;
// arr = this.dataconcatHandle(res.data);
// this.detailData.push(...arr);
// }else {
// this.hasForwardData = false;
// }
// }
// })
// },
// 上翻查看最新消息
getHistoryData(param) { // 最新的时间在最前面
let url = '/im/msg/history';
let req = {
doctorAccId: this.doctorAccId,
includeFlag: param,
lastMsgTimestamp: this.historyTime,
limit: 20,
patientAccId: this.picakfAccId,
unionId: ""
}
this.POST(url, req).then((res) => {
if(res.code == '000000') {
let arr = [], sortArr = [];
if(res.data.length > 0) {
this.hasHistoryData = true;
this.historyTime = res.data[res.data.length - 1].timestamp;
arr = this.dataconcatHandle(res.data.reverse());
this.detailData.unshift(...arr);
this.$forceUpdate();
this.$nextTick( () => {
setTimeout(() => {
let el = this.getElmByID('scroll-set');
if(param == 1) {
el.scrollTop = 20000;
} else {
el.scrollTop = 500;
}
}, 50);
})
}else {
this.hasHistoryData = false;
}
}
})
},
// 按照时间大小排序
timeSort(arrList) {
arrList.sort((a, b) => {
return a.timestamp - b.timestamp;
});
return arrList
},
// 数据合并转换
dataconcatHandle(data) {
let currentTaskId = '';
data.forEach((element, index) => {
element.timestamp = this.timeChange(element.timestamp);
element.sessionFlag = false;
if(index > 0) {
currentTaskId = data[index - 1].taskLogId;
if(element.taskLogId !== currentTaskId) {
element.sessionFlag = true;
}
}
this.$set(element, index, 'sessionFlag');
if(element.type == 'CUSTOM' || element.type == 'PICTURE') {
element.content = JSON.parse(element.content);
if(element.type == 'PICTURE') {
this.imgSizeHandleNew(element, element.content.w, element.content.h);
}
}
});
return data;
},
// 时间格式转换
timeChange(data) {
return timeHandle(data)
},
// 文件大小单位转换
fileSizeChange(val) {
return betaHandle(val)
},
// 打开PDF
downPDF(url) {
window.open(url, "__blank");
// window.location.href = url
}
}
};
</script>
<style lang="scss" scoped>
.search-msg-detail {
.detail-content {
margin: 80px 20px 0 20px;
padding: 10px 0px 0 20px;
background: #fff;
#scroll-set {
overflow-x: hidden;
overflow: scroll;
}
.split-line {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
// margin: 15px 0;
font-size: 14px;
color: #333;
&::before {
flex: 1;
content: '';
height: 1px;
margin-right: 18px;
background:#C7C8C9;
}
&::after {
flex: 1;
content: '';
height: 1px;
margin-left: 18px;
background:#C7C8C9;
}
}
.msg-container {
display: flex;
flex-direction: row;
padding-top: 12px;
border: none;
.msg-item-img {
width: 32px;
height: 32px;
margin-right: 8px;
& > img {
width: 100%;
height: 100%;
border-radius: 22px;
}
}
.msg-content {
display: flex;
flex-direction: column;
width: 100%;
text-align: left;
font-size: 13px;
.text-content {
padding: 10px 0 16px;
color: #333333;
//border-bottom: 1px solid #F0F1F2;
}
.text-content.pc-no-support {
img {
float: left;
padding-top: 3px;
padding-right: 5px;
width: 14px;
height: 14px;
}
}
.img-content {
padding: 10px 0 16px;
cursor: pointer;
.img-box {
max-width: 192px;
max-height: 320px;
overflow: hidden;
}
}
.file-content {
padding: 10px 0 16px;
.file-con {
display: flex;
flex-direction: row;
max-width: 260px;
text-align: left;
padding: 10px 15px;
background: #f0f1f2;
border-radius: 8px;
cursor: pointer;
.file-left {
display: flex;
flex-direction: column;
justify-content: space-around;
width: 190px;
.name {
font-size: 13px;
color: #333333;
}
.size {
font-size: 12px;
color: #999999;
}
}
.file-right {
width: 36px;
height: 44px;
& > img {
width: 36px;
height: 100%;
border-radius: 3px;
}
}
}
}
.link-content {
padding: 10px 0 16px;
.link-text {
color: #2f86f6;
}
}
}
}
.msg-container.has-line {
border-top: 1px solid #F0F1F2;
}
}
#scroll-set::-webkit-scrollbar {
width: 10px;
height: 5px;
background-color: #F0F1F2 !important;
}
#scroll-set::-webkit-scrollbar-thumb {
background-color: #F0F1F2 !important;
}
#scroll-set .item-content:last-child {
border-bottom: 1px solid #F0F1F2;
}
#scroll-set .item-content:first-child .msg-container {
border: none;
}
}
</style>
\ No newline at end of file
src/views/IM/search-message/list.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="message-list-wrap">
<div class="component-content screenSet" id="screenSet">
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;margin-right:10px;">
<el-form ref="serchForm" inline :model="searchParam" label-width="15px" style="width:100%;text-align:right;">
<el-form-item label="">
<el-input clearable v-model="searchParam.userMobile" size="small" placeholder="请输入用户电话" @change="searchMessage(1)">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</el-form-item>
<el-form-item label="">
<el-input clearable v-model="searchParam.userName" size="small" placeholder="请输入用户名称" @change="searchMessage(1)">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</el-form-item>
<el-form-item label="">
<el-input clearable v-model="searchParam.adminName" size="small" placeholder="请输入客服名" @change="searchMessage(1)">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</el-form-item>
<el-form-item label="" style="position:relative;top:-5px;left:0;margin-bottom: 0px;">
<el-date-picker
v-model="date"
size="small"
type="date"
placeholder="请选择日期"
value-format="yyyy-MM-dd"
@change="searchMessage(1)"></el-date-picker>
</el-form-item>
</el-form>
</el-row>
<el-table :data="tableData" style="width: 99%;padding: 0 30px;" v-loading="loading">
<el-table-column prop="userName" label="用户名" min-width="50" align="left"></el-table-column>
<el-table-column prop="communicationNumber" label="对话次数" min-width="100" align="left"></el-table-column>
<el-table-column label="用户类型" min-width="50" align="left">
<template slot-scope="scope">
<span>{{scope.row.idType | typeFilter}}</span>
</template>
</el-table-column>
<el-table-column prop="certStatus" label="认证状况" min-width="100" align="left"></el-table-column>
<el-table-column prop="hospitalName" label="所属机构" min-width="120" align="left"></el-table-column>
<el-table-column label="操作" fixed="right" align="left" min-width="100">
<template slot-scope="scope">
<el-button type="text" size="medium" @click="edit(scope.row)">查看详细</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../../assets/image/IM/no-search-list.png" />
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { validateWord } from "@/utils/validate.js";
import { openLoading, closeLoading } from "@/utils/utils";
import * as commonUtil from "@/utils/utils";
let vm = null;
export default {
data() {
return {
date: '',
searchParam: {
adminName: "",
chooseDate: "",
userMobile: "",
userName: "",
pageNo: 1,
pageSize: 15
},
totalRows: 0,
tableData: [],
loading: false,
// hasSearchDate: false // 查询条件不包含日期
};
},
computed: {},
filters: {
typeFilter(index) {
let str = "";
if (index == 1) {
str = "医生";
} else if (index == 2) {
str = "居民";
}
return str;
}
},
created() {
},
// 挂载到Dom完成时
mounted() {
commonUtil.resizeHeight(92);
this.searchMessage();
},
methods: {
// 列表查询
searchMessage(a) {
if(a) this.searchParam.pageNo = 1;
if(a == 2) return;
this.loading = true;
let url = `/im/system/message/list`;
this.searchParam.chooseDate = this.date ? new Date(this.date).getTime() : '';
let params = this.searchParam;
this.GET(url, params).then(res => {
this.loading = false;
if (res.code == "000000") {
this.tableData = res.data.list;
this.totalRows = res.data.total;
}
});
},
// 查看消息详情
edit(row) {
// if(this.searchParam.chooseDate) this.hasSearchDate = true;
this.$router.push({
path: `/search-message-detail`,
query: {
msgTimestamp: row.msgTimestamp,
doctorAccId: row.accId,
userName: row.userName,
avatarImageUrl: row.avatarImageUrl,
// hasSearchDate: this.hasSearchDate
}
});
},
handleSizeChange(value) {
this.searchParam.pageSize = value;
this.searchMessage();
},
handleCurrentChange(value) {
this.searchParam.pageNo = value;
this.searchMessage();
}
}
};
</script>
<style lang="scss" scoped>
.message-list-wrap {
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
.search-title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 10px 12px;
font-size: 12px;
margin-bottom: 20px;
border-bottom: 1px solid #efefef;
.num {
color: #0D9078;
}
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
margin-top: 20px;
img {
width: 100px;
}
p {
margin-top: -45px;
}
}
}
}
</style>
\ No newline at end of file
src/views/IM/waiting-session/list.vue 已删除 100644 → 0
浏览文件 @ 5273e5c3
<template>
<div class="wts-list-wrap">
<!-- <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb> -->
<div class="component-content screenSet" id="screenSet">
<div class="search-title">
<p>当前共有<span class="num">{{total}}位</span>用户正在等待</p>
<el-button type="primary" size="small" @click="getNextSession()">给我一个任务</el-button>
</div>
<el-table :data="tableData" style="width: 100%" v-loading="loading">
<el-table-column prop="userName" label="用户名" min-width="50" align="center"></el-table-column>
<el-table-column prop="waitTime" label="等待时间" min-width="100" align="center">
<template slot-scope="scope">
<span>{{scope.row.waitTime * 1000 | continueTimesFilter(true)}}</span>
</template>
</el-table-column>
<el-table-column prop="idType" label="用户类型" min-width="50" align="center">
<template slot-scope="scope">
<span>{{scope.row.idType | typeFilter}}</span>
</template>
</el-table-column>
<el-table-column prop="certStatus" label="认证状况" min-width="100" align="center"></el-table-column>
<el-table-column prop="hospitalName" label="所属机构" min-width="50" align="center"></el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../../assets/image/IM/no-search-list.png" />
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
</div>
</div>
</template>
<script>
import { mapGetters, mapMutations } from 'vuex';
import BreadCrumb from "@/components/breadcrumb.vue";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { validateWord } from "@/utils/validate.js";
import { openLoading, closeLoading } from "@/utils/utils";
import * as commonUtil from "@/utils/utils";
let vm = null;
// let intervalId = null;
export default {
components: {
BreadCrumb
},
data() {
return {
curmbFirst: "云鹊客服",
curmbSecond: "等待会话",
tableData: [],
total: 0,
loading: false,
};
},
computed: {
},
filters: {
typeFilter(index) {
let str = "";
if (index == 1) {
str = "医生";
} else if (index == 2) {
str = "居民";
}
return str;
}
},
created() {
this.getListData();
// intervalId = setInterval(() => {
// this.getListData();
// }, 10000);
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight(76, 134);
},
methods: {
...mapMutations(['SET_IS_FROM_ASSIGN_TASK']),
// 获取数据
getListData() {
this.loading = true;
this.GET('/im/task/list?pageNo=1&pageSize=40').then((res) => {
this.loading = false;
if( res.code === '000000') {
this.tableData = res.data.list || [];
this.total = res.data.total;
} else {
this.$message({
message: res.message,
type: 'error'
});
}
})
},
// 给我一个任务吧，如果当前没有任务，则要提示
getNextSession() {
this.GET('/im/session/kf/fetchOneTask').then((res) => {
if( res.code === '000000') {
this.SET_IS_FROM_ASSIGN_TASK(true);
this.$router.push({ path: `/diagnosis-list` });
} else {
this.$message({
message: res.message,
type: 'error'
});
}
})
},
},
// 离开页面时，清除定时器
beforeDestroy() {
// intervalId && clearInterval(intervalId);
},
};
</script>
<style lang="scss" scoped>
.wts-list-wrap {
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
.search-title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 10px 12px;
font-size: 12px;
margin-bottom: 20px;
border-bottom: 1px solid #efefef;
p {
font-size: 16px;
color: #000;
}
.num {
font-weight: 700;
color: #0D9078;
}
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
margin-top: 20px;
img {
width: 100px;
}
p {
margin-top: -45px;
}
}
}
}
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或