<style>
.tt-file-box {
display: flex;
background-color: #ffffff;
width: 380px !important;
cursor: pointer;
}
.tt-img {
width: 80px;
height: 100px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-image: url("http://oa.qudaotong.com.cn/uploads/defaultLogo.png");
margin-right: 10px;
}
.tt-title {
font-size: 16px;
color: #333333;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.tt-content {
font-size: 13px;
color: #666;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.tt-file-box {
line-height: 25px;
}
.tt-des {
width: 275px;
word-wrap: break-word;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
line-height: 18px;
margin: 5px auto;
font-size: 13px;
color: #888;
}
</style>
<template>
<div class="tip-box" v-if="msg.type==='timeTag' && sort!==0">
<div class="item-time">{{msg.showText}}</div>
</div>
<div class="tip-box" v-else-if="msg.type==='tip'">
<div class="item-tip">{{msg.showText}}</div>
</div>
<div v-else-if="msg.flow==='in'" class="line-msg-left clearfix">
<div class="tip-box" v-if="msg.type==='notification'">
<div class="item-time" v-if="msg.attach.type==='addTeamMembers'">
{{msg.attach.users[msg.attach.users.length-1].nick}}邀请
<span v-for="i in cutLastMember(msg)">{{i}}、</span>入群
</div>
<div class="item-time" v-if="msg.attach.type==='removeTeamMembers'">
{{msg.attach.users[msg.attach.users.length-1].nick}}将
<span v-for="i in cutLastMember(msg)">{{i}}、</span>移除了群聊
</div>
<div
class="item-time"
v-if="msg.attach.type==='updateTeam' && msg.attach.team.name"
>{{msg.attach.users[0].nick}}更新了群聊名称</div>
<div
class="item-time"
v-if="msg.attach.type==='updateTeam' && msg.attach.team.intro"
>{{msg.attach.users[0].nick}}更新了群聊介绍</div>
</div>
<img v-if="msg.type!=='notification'" :src="msg.avatar" class="head">
<div
v-show="msg.scene=='team'"
style="font-size: 14px; color: #666; text-indent: 20px; margin-bottom: 3px;"
>{{msg.fromNick}}</div>
<span class="comment-left customBg" v-if="msg.type==='custom'">
<div v-if="JSON.parse(msg.content).data.content.fileType==='image'" @click.stop="showFullImg(JSON.parse(msg.content).data.content.fileUrl)">
<!--图片-->
<img style="max-width:300px;" :src="JSON.parse(msg.content).data.content.fileUrl">
</div>
<div v-else>
<div class="customDiv" @click="analyzeItem(JSON.parse(msg.content))">
<div class="iconDiv">
<img
v-if="JSON.parse(msg.content).data.content.fileType==='word'"
src="../../assets/img/notice_ico_word @2x.png"
>
<!--word-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='xls'"
src="../../assets/img/notice_ico_excel@2x.png"
>
<!--excel-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='ppt'"
src="../../assets/img/notice_ico_ppt@2x.png"
>
<!--ppt-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='music'"
src="../../assets/img/notice_ico_music@2x.png"
>
<!--video-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='video'"
src="../../assets/img/notice_ico_video@2x.png"
>
<!--word-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='txt'"
src="../../assets/img/notice_ico_txt@2x.png"
>
<!--txt-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='ZIP'"
src="../../assets/img/notice_ico_rar@2x.png"
>
<!--ZIP-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='pdf'"
src="../../assets/img/notice_ico_pdf@2x.png"
>
<!--pdf-->
<img v-else height="40" src="../../assets/img/notice_ico_others@2x.png">
<!--other-->
</div>
<div>
<p class="fileName">{{JSON.parse(msg.content).data.pushContent}}</p>
<p>
<span class="fileSize">{{JSON.parse(msg.content).data.content.fileSize}}</span>
</p>
</div>
</div>
<div class="downloadDiv">
<span class="dowload fr" @click.stop="downloadMsg(msg.content)">
<i class="iconfont icon-ico-xiazai"></i> 下载
</span>
</div>
</div>
</span>
<span class="comment-left" v-if="msg.type==='text'&&!msg.custom">
<a
href="javascript:void(0)"
v-if="msg.isUrl"
@click.stop="openURL(msg.showText)"
>{{msg.showText}}</a>
<span v-if="!msg.isUrl" v-html="msg.showText"></span>
</span>
<span v-else-if="msg.type==='custom-type1'" class="comment-left" ref="mediaMsg"></span>
<span v-else-if="msg.type==='custom-type3'" class="comment-left" ref="mediaMsg"></span>
<span
v-else-if="msg.type==='image'"
class="comment-left"
ref="mediaMsg"
@click.stop="showFullImg(msg.originLink)"
></span>
<span class="comment-left customBg" v-if="msg.type==='file'">
<div>
<div class="customDiv" @click="analyzeItem(msg.showText)">
<div class="iconDiv">
<img
v-if="msg.fileType==='word' || msg.fileType==='docx' || msg.fileType==='doc'"
src="../../assets/img/notice_ico_word @2x.png"
>
<!--word-->
<img
v-else-if="msg.fileType==='xls' || msg.fileType==='xlsx'"
src="../../assets/img/notice_ico_excel@2x.png"
>
<!--excel-->
<img
v-else-if="msg.fileType==='ppt' || msg.fileType==='pptx'"
src="../../assets/img/notice_ico_ppt@2x.png"
>
<!--ppt-->
<img
v-else-if="msg.fileType==='music' ||msg.fileType==='mp3' "
src="../../assets/img/notice_ico_music@2x.png"
>
<!--video-->
<img
v-else-if="msg.fileType==='video' ||msg.fileType==='mp4'"
src="../../assets/img/notice_ico_video@2x.png"
>
<!--word-->
<img
v-else-if="msg.fileType==='txt'"
src="../../assets/img/notice_ico_txt@2x.png"
>
<!--txt-->
<img
v-else-if="msg.fileType==='ZIP'"
src="../../assets/img/notice_ico_rar@2x.png"
>
<!--ZIP-->
<img
v-else-if="msg.fileType==='pdf'"
src="../../assets/img/notice_ico_pdf@2x.png"
>
<!--pdf-->
<img v-else height="40" src="../../assets/img/notice_ico_others@2x.png">
<!--other-->
</div>
<div>
<p class="fileName">{{msg.showText}}</p>
<p>
<span class="fileSize">{{msg.showSize}}</span>
</p>
</div>
</div>
<div class="downloadDiv">
<span class="dowload fr">
<i class="iconfont icon-ico-xiazai"></i> <a :href='msg.fileLink' :download="msg.showText">下载</a>
</span>
</div>
</div>
</span>
</div>
<div v-else-if="msg.flow==='out'" class="line-msg-right clearfix">
<!--发出消息-->
<div class="tip-box" v-if="msg.type==='notification'">
<div class="item-time" v-if="msg.attach.type==='addTeamMembers'">你邀请
<span v-for="i in cutLastMember(msg)">{{i}}、</span>入群
</div>
<div class="item-time" v-if="msg.attach.type==='removeTeamMembers'">你将
<span v-for="i in cutLastMember(msg)">{{i}}、</span>移除了群聊
</div>
<div class="item-time" v-if="msg.attach.type==='updateTeam' && msg.attach.team.name">你更新了群聊名称</div>
<div class="item-time" v-if="msg.attach.type==='updateTeam' && msg.attach.team.intro">你更新了群聊介绍</div>
</div>
<img v-if="msg.type!=='notification'" :src="msg.avatar" class="head">
<span class="comment-right" v-if="msg.type==='text'&&!msg.custom">
<a
href="javascript:void(0)"
v-if="msg.isUrl"
@click.stop="openURL(msg.showText)"
>{{msg.showText}}</a>
<span v-if="!msg.isUrl" v-html="msg.showText"></span>
</span>
<span v-else-if="msg.type==='custom-type1'" class="comment-right" ref="mediaMsg"></span>
<span v-else-if="msg.type==='custom-type3'" class="comment-right" ref="mediaMsg"></span>
<span class="comment-right" v-if="msg.type==='custom'">
<div v-if="JSON.parse(msg.content).data.content.fileType==='image'" @click.stop="showFullImg(JSON.parse(msg.content).data.content.fileUrl)">
<!--图片-->
<img style="max-width:300px;" :src="JSON.parse(msg.content).data.content.fileUrl">
</div>
<div v-else>
<div class="customDiv" @click="analyzeItem(JSON.parse(msg.content))">
<div class="iconDiv">
<img
v-if="JSON.parse(msg.content).data.content.fileType==='word'"
src="../../assets/img/notice_ico_word @2x.png"
>
<!--word-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='xls'"
src="../../assets/img/notice_ico_excel@2x.png"
>
<!--excel-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='ppt'"
src="../../assets/img/notice_ico_ppt@2x.png"
>
<!--ppt-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='music'"
src="../../assets/img/notice_ico_music@2x.png"
>
<!--video-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='video'"
src="../../assets/img/notice_ico_video@2x.png"
>
<!--word-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='txt'"
src="../../assets/img/notice_ico_txt@2x.png"
>
<!--txt-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='zip'"
src="../../assets/img/notice_ico_rar@2x.png"
>
<!--ZIP-->
<img
v-else-if="JSON.parse(msg.content).data.content.fileType==='pdf'"
src="../../assets/img/notice_ico_pdf@2x.png"
>
<!--pdf-->
<img v-else height="40" src="../../assets/img/notice_ico_others@2x.png">
<!--other-->
</div>
<div>
<p class="fileName">{{JSON.parse(msg.content).data.pushContent}}</p>
<p>
<span class="fileSize">{{JSON.parse(msg.content).data.content.fileSize}}</span>
</p>
</div>
</div>
<div class="downloadDiv">
<span class="dowload fr" @click.stop="downloadMsg(msg.content)">
<i class="iconfont icon-ico-xiazai"></i> 下载
</span>
</div>
</div>
</span>
<span class="comment-right" v-if="msg.type==='file'">
<div>
<div class="customDiv" @click="analyzeItem(msg.showText)">
<div class="iconDiv">
<img
v-if="msg.fileType=='word' || msg.fileType=='docx' || msg.fileType=='doc'"
src="../../assets/img/notice_ico_word @2x.png"
>
<!--word-->
<img
v-else-if="msg.fileType=='xls' || msg.fileType=='xlsx'"
src="../../assets/img/notice_ico_excel@2x.png"
>
<!--excel-->
<img
v-else-if="msg.fileType==='ppt' || msg.fileType==='pptx'"
src="../../assets/img/notice_ico_ppt@2x.png"
>
<!--ppt-->
<img
v-else-if="msg.fileType==='music' ||msg.fileType==='mp3' "
src="../../assets/img/notice_ico_music@2x.png"
>
<!--video-->
<img
v-else-if="msg.fileType==='video' ||msg.fileType==='mp4'"
src="../../assets/img/notice_ico_video@2x.png"
>
<!--word-->
<img
v-else-if="msg.fileType==='txt'"
src="../../assets/img/notice_ico_txt@2x.png"
>
<!--txt-->
<img
v-else-if="msg.fileType==='ZIP'"
src="../../assets/img/notice_ico_rar@2x.png"
>
<!--ZIP-->
<img
v-else-if="msg.fileType==='pdf'"
src="../../assets/img/notice_ico_pdf@2x.png"
>
<!--pdf-->
<img v-else height="40" src="../../assets/img/notice_ico_others@2x.png">
<!--other-->
</div>
<div>
<p class="fileName">{{msg.showText}}</p>
<p>
<span class="fileSize">{{msg.showSize}}</span>
</p>
</div>
</div>
<div class="downloadDiv">
<span class="dowload fr" @click.stop="downloadWYIM(msg.fileLink,msg.showText)">
<i class="iconfont icon-ico-xiazai"></i> 下载
</span>
</div>
</div>
</span>
<span
v-else-if="msg.type==='image'"
class="comment-right"
ref="mediaMsg"
@click.stop="showFullImg(msg.originLink)"
></span>
<!--@click.stop="showFullImg(msg.originLink)"-->
<el-dialog
custom-class="w800"
:title="dialogTitle4"
:visible.sync="outerVisible4"
center
:modal-append-to-body="false"
>
<video
:src="moviePath"
controls="controls"
style="width: 100%;"
>your browser does not support the video tag</video>
<div slot="footer" class="dialog-footer">
<input type="button" class="normalBtn" value="关闭" @click="outerVisible4=false">
</div>
</el-dialog>
<div
v-if="audioIsShow"
style="position: fixed; bottom: 100px; right: 20px; z-index: 999; border:1px solid #ccc; padding: 10px; background: #eee;"
>
<i
class="el-icon-circle-close-outline"
style="float: right; cursor: pointer;"
@click="audioIsShow=false,audioPath=''"
></i>
<p style="font-size: 12px; margin: 0 0 10px 0;">{{audioName}}</p>
<audio :src="audioPath" controls="controls">Your browser does not support the audio tag.</audio>
</div>
</div>
</template>
<script type="text/javascript">
import util from "../../utils";
import config from "../../configs";
import emojiObj from "../../configs/emoji";
export default {
props: {
type: String, // 类型，chatroom, session
downloading: false,
sort: Number,
rawMsg: {
type: Object,
default() {
return {};
}
},
userInfos: {
type: Object,
default() {
return {};
}
},
myInfo: {
type: Object,
default() {
return {};
}
},
isRobot: {
type: Boolean,
default() {
return false;
}
},
robotInfos: {
type: Object,
default() {
return {};
}
}
},
data() {
return {
msg: "",
isFullImgShow: false,
currentAudio: null,
isLoading: false,
isDownloading: false,
timeIndex: 0,
audioIsShow: false,
outerVisible4: false,
dialogTitle4: "",
moviePath: "",
audioPath: "",
imgs:[]
};
},
computed: {
// robotInfos () {
// return this.$store.state.robotInfos
// }
},
beforeMount() {
this.imgs=[]
let item = Object.assign({}, this.rawMsg);
// 标记用户，区分聊天室、普通消息
if (this.type === "session") {
if (item.flow === "in") {
if (item.type === "robot" && item.content && item.content.msgOut) {
// 机器人下行消息
let robotAccid = item.content.robotAccid;
item.avatar = this.robotInfos[robotAccid].avatar;
item.isRobot = true;
item.link = `#/namecard/${robotAccid}`;
} else if (item.from !== this.$store.state.userUID) {
item.avatar =
(this.userInfos[item.from] && this.userInfos[item.from].avatar) ||
config.defaultUserIcon;
item.link = `#/namecard/${item.from}`;
} else {
item.avatar = this.myInfo.avatar;
}
} else if (item.flow === "out") {
item.avatar = this.myInfo.avatar;
}
} else {
// 标记时间，聊天室中
item.showTime = util.formatDate(item.time);
}
if (item.type === "timeTag") {
// 标记发送的时间
item.showText = item.text;
this.timeIndex += 1;
} else if (item.type === "text") {
if (item.custom && JSON.parse(item.custom).layout === 3) {
item.showIcon = this.getFileIcon(JSON.parse(item.custom).extension);
item.locationPath = this.getLocationPath(JSON.parse(item.custom).md5);
item.showSize = this.bytesToSize(JSON.parse(item.custom).size);
item.locationFolder =
item.locationPath === ""
? ""
: item.locationPath.substring(
0,
item.locationPath.lastIndexOf("\\") + 1
);
}
// 文本消息
item.showText = util.escape(item.text);
if (this.isURL(item.showText)) {
item.isUrl = true;
} else {
item.showText = this.replaceURL(item.showText);
}
if (/\[[^\]]+\]/.test(item.showText)) {
let emojiItems = item.showText.match(/\[[^\]]+\]/g);
emojiItems.forEach(text => {
let emojiCnt = emojiObj.emojiList.emoji;
if (emojiCnt[text]) {
item.showText = item.showText.replace(
text,
`<img class="emoji-small" src="${emojiCnt[text].img}">`
);
}
});
}
} else if (item.type === "custom") {
if (item.custom) {
let param = JSON.parse(item.custom);
if (param.data.layout == 5) {
let formatArray = [];
for (var i = 0; i < param.data.linkList.length; i++) {
let tem = param.data.linkList[i];
formatArray.push(
'<a data-href="' +
tem.URLPath +
'" href="javascript:void(0)" class="">' +
tem.Name +
"</a>"
);
}
param.data.templateContent = this.format(
param.data.templateContent,
formatArray
);
item.showText = param.data.templateContent;
item.enableClick = true;
item.type = "text";
item.custom = null;
this.msg = item;
return;
}
}
let content = JSON.parse(item.content);
// type 1 为猜拳消息
if (content.type === 1) {
let data = content.data;
let resourceUrl = config.resourceUrl;
// item.showText = `<img class="emoji-middle" src="${resourceUrl}/im/play-${data.value}.png">`
item.type = "custom-type1";
item.imgUrl = `${resourceUrl}/im/play-${data.value}.png`;
// type 3 为贴图表情
} else if (content.type === 3) {
let data = content.data;
let emojiCnt = "";
if (emojiObj.pinupList[data.catalog]) {
emojiCnt = emojiObj.pinupList[data.catalog][data.chartlet];
// item.showText = `<img class="emoji-big" src="${emojiCnt.img}">`
item.type = "custom-type3";
item.imgUrl = `${emojiCnt.img}`;
}
} else if (content.data.content.fileType==='image') {
this.MsgBus.$emit('imgprevpush',content.data.content.fileUrl)
} else {
item.showText = util.parseCustomMsg(item);
if (item.showText !== "[自定义消息]") {
item.showText += ",请到手机或电脑客户端查看";
}
}
} else if (item.type === "image") {
// 原始图片全屏显示
item.originLink = item.file.url;
this.MsgBus.$emit('imgprevpush',item.file.url)
} else if (item.type === "video") {
// ...
} else if (item.type === "audio") {
item.audioSrc = item.file.mp3Url;
item.showText = Math.round(item.file.dur / 1000) + '" 点击播放';
} else if (item.type === "file") {
item.fileLink = item.file.url;
item.showText = item.file.name;
item.locationPath = this.getLocationPath(item.file.md5);
item.showSize = this.bytesToSize(item.file.size);
if (item.custom) {
let demoCustom = JSON.parse(item.custom);
if (demoCustom && demoCustom.fileName) {
item.showText = demoCustom.fileName;
}
}
item.locationFolder =
item.locationPath === ""
? ""
: item.locationPath.substring(
0,
item.locationPath.lastIndexOf("\\") + 1
);
item.showIcon = this.getFileIcon(item.showText);
item.fileType=item.showText.split('.')[1]
} else if (item.type === "notification") {
// 对于系统通知，更新下用户信息的状态
item.showText = util.generateChatroomSysMsg(item);
} else if (item.type === "tip") {
// 对于系统通知，更新下用户信息的状态
item.showText = item.tip;
} else if (item.type === "robot") {
let content = item.content || {};
let message = content.message || [];
if (!content.msgOut) {
// 机器人上行消息
item.robotFlow = "out";
item.showText = item.text;
} else if (content.flag === "bot") {
item.subType = "bot";
message = message.map(item => {
if (item.type === "template") {
// 在vuex(store/actions/msgs.js)中已调用sdk方法做了转换
return item.content.json;
} else if (item.type === "text" || item.type === "answer") {
// 保持跟template结构一致
return [
{
type: "text",
text: item.content
}
];
} else if (item.type === "image") {
// 保持跟template结构一致
return [
{
type: "image",
url: item.content
}
];
}
});
item.message = message;
} else if (item.content.flag === "faq") {
item.subType = "faq";
item.query = message.query;
let match = message.match.sort((a, b) => {
// 返回最匹配的答案
return b.score - a.score;
});
item.message = match[0];
}
} else {
item.showText = `[${util.mapMsgType(item)}],请到手机或电脑客户端查看`;
}
this.msg = item;
},
mounted() {
let item = this.msg;
// 有时序问题的操作
this.$nextTick(() => {
let media = null;
if (item.type === "image") {
// 图片消息缩略图
media = new Image();
this.MsgBus.$emit('imgprevpush',item.file.url)
media.src = item.file.url + "?imageView&thumbnail=180x0&quality=85";
} else if (item.type === "custom-type1") {
// 猜拳消息
media = new Image();
media.className = "emoji-middle";
media.src = item.imgUrl;
} else if (item.type === "custom-type3") {
// 贴图表情
media = new Image();
media.className = "emoji-big";
media.src = item.imgUrl;
} else if (item.type === "video") {
if (/(mov|mp4|ogg|webm)/i.test(item.file.ext)) {
media = document.createElement("video");
media.src = item.file.url;
media.width = 640;
media.height = 480;
media.autoStart = false;
media.preload = "metadata";
media.controls = "controls";
} else {
let aLink = document.createElement("a");
aLink.href = item.file.url;
aLink.target = "_blank";
aLink.innerHTML = `<i class="u-icon icon-file"></i>${video.name}`;
this.$refs.mediaMsg.appendChild(aLink);
}
} else if (
item.type === "text" &&
item.custom &&
JSON.parse(item.custom).layout === 2
) {
// 图片消息缩略图
media = new Image();
this.MsgBus.$emit('imgprevpush',JSON.parse(item.custom).url)
media.src=JSON.parse(item.custom).url;
// media.src =
// this.getQueryString(JSON.parse(item.custom).url, "path") +
// "?x-oss-process=image/resize,m_lfit,w_" +
// 180 +
// ",h_" +
// 270;
}
if (media) {
if (this.$refs.mediaMsg) {
this.$refs.mediaMsg.appendChild(media);
}
media.onload = () => {
this.$emit("msg-loaded");
};
media.onerror = () => {
this.$emit("msg-loaded");
};
} else {
this.$emit("msg-loaded");
}
}); // end this.nextTick
},
methods: {
downloadMsg(obj) {
let reg = /^http(s)?:\/\/(.*?)\//;
this.downloadFileRename(
JSON.parse(obj).data.content.fileUrl.replace(reg, ""),
JSON.parse(obj).data.pushContent
);
},
downloadWYIM(url,name){
this.downloadFileRename('',name,url);
},
analyzeItem(obj) {
// {{JSON.parse(msg.content).data.pushContent}}
// {{JSON.parse(msg.content).data.content.fileType}}
let fileType = typeof obj=='string' ? obj.split('.')[0]: obj.data.content.fileType;
switch (fileType) {
case 1:
this.list.forEach(item => {
if (item.DataType == 2) {
let fileType = item.FolderName.substring(
item.FolderName.lastIndexOf(".") + 1,
item.FolderName.length
).toUpperCase();
if ("GIF|JPG|JPEG|PNG|BMP".indexOf(fileType) != -1) {
this.picObj.push(item.FilePath);
}
}
});
this.picObj.forEach((x, i) => {
if (x == obj.FilePath) {
this.initialIndex = i;
return false;
}
});
this.picIsShow = true;
//this.picPath=obj.FilePath
break;
case "music":
this.audioIsShow = true;
this.audioName = obj.data.pushContent;
this.audioPath = obj.data.content.fileUrl;
break;
case "video":
this.outerVisible4 = true;
this.dialogTitle4 = obj.data.pushContent;
this.moviePath = obj.data.content.fileUrl;
break;
case "xls":
window.open(
"https://view.officeapps.live.com/op/view.aspx?src=" +
obj.data.content.fileUrl
);
break;
case "xlsx":
window.open(
"https://view.officeapps.live.com/op/view.aspx?src=" +
obj.data.content.fileUrl
);
break;
case "word":
window.open(
"https://view.officeapps.live.com/op/view.aspx?src=" +
obj.data.content.fileUrl
);
break;
case "ppt":
window.open(
"https://view.officeapps.live.com/op/view.aspx?src=" +
obj.data.content.fileUrl
);
break;
case "pptx":
window.open(
"https://view.officeapps.live.com/op/view.aspx?src=" +
obj.data.content.fileUrl
);
break;
case "pdf":
this.previewPDF(obj.data.content.fileUrl);
break;
default:
this.$message.warning(
"该文件格式暂不支持预览,请下载用相关软件预览！"
);
break;
}
},
cutLastMember(obj) {
let newArr = [];
let me = obj.from;
obj.attach.users.forEach(item => {
if (item.account != me) {
newArr.push(item.nick);
}
});
return newArr;
},
revocateMsg(vNode) {
// 在会话聊天页
if (this.$store.state.currSessionId) {
if (vNode && vNode.data && vNode.data.attrs) {
let attrs = vNode.data.attrs;
if (attrs.type === "robot") {
return;
}
// 自己发的消息
if (attrs.flow === "out") {
let that = this;
this.$vux.confirm.show({
title: "确定需要撤回消息",
onCancel() {},
onConfirm() {
that.$store.dispatch("revocateMsg", {
idClient: attrs.idClient
});
}
});
}
}
}
},
format(str, args) {
if (args.length == 0) return str;
for (var i = 0; i < args.length; i++) {
str = str.replace(new RegExp("\\{" + i + "\\}", "g"), args[i]);
}
return str;
},
sendRobotBlockMsg(msg, originMsg) {
let body = "[复杂按钮模板触发消息]";
if (msg.text && msg.text.length === 1) {
body = msg.text[0].text;
}
let robotAccid = originMsg.content.robotAccid;
if (!this.isRobot) {
body = `@${this.robotInfos[robotAccid].nick} ${body}`;
}
if (this.type === "session") {
this.$store.dispatch("sendRobotMsg", {
type: "link",
scene: originMsg.scene,
to: originMsg.to,
robotAccid,
// 机器人后台消息
params: msg.params,
target: msg.target,
// 显示的文本消息
body
});
} else if (this.type === "chatroom") {
this.$store.dispatch("sendChatroomRobotMsg", {
type: "link",
robotAccid,
// 机器人后台消息
params: msg.params,
target: msg.target,
// 显示的文本消息
body
});
}
},
continueRobotMsg(robotAccid) {
this.$store.dispatch("continueRobotMsg", robotAccid);
},
showFullImg(src) {
this.MsgBus.$emit('imgpreviewshowindex',src)
},
playAudio(src) {
if (!this.currentAudio) {
this.currentAudio = new Audio(src);
this.currentAudio.play();
this.currentAudio.onended = () => {
this.currentAudio = null;
};
}
},
downloadFile(msgId, name) {
event.preventDefault();
if (this.isDownloading) return false;
let dPath = event.srcElement.href;
let dName = name;
let crt = this;
},
openParentLocaltion(path, msgId, name) {
if (path === "") {
this.downloadFile(msgId, name);
} else {
this.openLocaltion(path);
}
},
getLocationPath(msgId) {
let downloadFileList = [];
if (window.localStorage.downloadFileList) {
downloadFileList = JSON.parse(window.localStorage.downloadFileList);
let dPath = "";
downloadFileList.forEach((item, index) => {
if (item.msgID === msgId) {
dPath = item.locationPath;
}
});
return dPath;
}
return "";
},
bytesToSize(bytes) {
if (bytes === 0) return "0B";
var k = 1024;
var sizes = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
var i = Math.floor(Math.log(bytes) / Math.log(k));
return (bytes / Math.pow(k, i)).toFixed(1) + sizes[i];
},
getFileIcon(fileName) {
let ftype = fileName.substring(
fileName.lastIndexOf(".") + 1,
fileName.length
);
var icons = [
{ name: "rar", value: "zt-rar" },
{ name: "zip", value: "zt-rar" },
{ name: "7z", value: "zt-rar" },
{ name: "doc", value: "zt-Word" },
{ name: "docx", value: "zt-Word" },
{ name: "xls", value: "zt-Excel" },
{ name: "xlsx", value: "zt-Excel" },
{ name: "ppt", value: "zt-ppt" },
{ name: "pptx", value: "zt-ppt" },
{ name: "pdf", value: "zt-pdf1" },
{ name: "txt", value: "zt-txt" }
];
var huiIcon = "zt-weizhi1";
icons.forEach((item, index) => {
if (item.name.toUpperCase() === ftype.toUpperCase()) {
huiIcon = item.value;
}
});
return "icon zt-icon " + huiIcon;
},
isURL(str_url) {
var urlRegExp = /^((https|http|ftp|rtsp|mms)?:\/\/)+[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;
if (urlRegExp.test(str_url)) {
return true;
} else {
return false;
}
},
replaceURL(str) {
var urlRegExp = /(http[s]?:\/\/([\w-]+.)+([:\d+])?(\/[\w-\.\/\?%&=]*)?)/gi;
str = str.replace(urlRegExp, function($1) {
return "<a href='javascript:'>" + $1.toLowerCase() + "</a>";
});
return str;
},
openURLInContainer(event) {
if (event.target.nodeName === "A") {
this.openURL(event.target.innerText);
}
},
getQueryString(url, name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = url.split("?")[1].match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
}
}
};
</script>