Commit b900e056 authored by 夏敏伟's avatar 夏敏伟

聊天室优化

parent f1c9d809
......@@ -135,4 +135,12 @@ export default[
parent_name: "数据管理"//人物详情对应的一级菜单名称
}
},
{
name: "聊天室详情",
path: "/chatRoomInfo",
component:() => import(`@/view/ddkz/components/chatRoomInfo.vue`),
meta: {
parent_name: "导调控制"//人物详情对应的一级菜单名称
}
},
]
\ No newline at end of file
......@@ -7,22 +7,26 @@
<div v-for="item in chatMessageList" class="everyMessage">
<div :style="{ justifyContent: item.fromUserId == userInfo.account ? 'flex-end' : 'flex-start' }">
<template v-if="item.fromUserId != userInfo.account">
<img class="avatarImg" :src="avatar" alt="">
<!-- <div v-text="item.content" style="background-color:white"></div> -->
<div v-if="item.messageForm == 'TEXT'" v-html="item.content" style="background-color: white;">
<img class="otherSidesAvatarImg" :src="avatar" alt="">
<div class="otherSides">
<div class="otherSides-user" v-text="item.fromUserId"></div>
<div class="otherSides-text" v-if="item.messageForm == 'TEXT'" v-html="item.content"
style="background-color: white;">
</div>
<el-image class="otherSides-img" v-else-if="item.messageForm == 'PICTURE'"
style="width: 150px; height: 100px;margin: 0;" :src="item.content"
:preview-src-list="[item.content]">
</el-image>
</div>
<el-image v-else-if="item.messageForm == 'PICTURE'" style="width: 150px; height: 100px"
:src="item.content" :preview-src-list="[item.content]">
</el-image>
</template>
<template v-else-if="item.fromUserId == userInfo.account">
<div v-if="item.messageForm == 'TEXT'" v-html="item.content"
<div class="mySides-text" v-if="item.messageForm == 'TEXT'" v-html="item.content"
style="background-color: #85ce61;">
</div>
<el-image v-else-if="item.messageForm == 'PICTURE'" style="width: 150px; height: 100px"
<el-image v-else-if="item.messageForm == 'PICTURE'" style="width: 150px; height: 100px"
:src="item.content" :preview-src-list="[item.content]">
</el-image>
<img class="avatarImg" :src="avatar" alt="">
<img class="MySidesAvatarImg" :src="avatar" alt="">
</template>
</div>
</div>
......@@ -49,7 +53,7 @@ import { getRecordsByPagingTeam } from '../../../api/chat/chatRecords';
import elDragDialog from "@/util/directive/el-dragDialog";
import onPaste from '@/util/onPaste.js';
import { upLoadFiles } from '@/api/chat/chatRoom';
import { getTime_extent, download } from '@/util/http_util.js';
import { getTime_extent } from '@/util/http_util.js';
export default {
data() {
return {
......@@ -59,7 +63,7 @@ export default {
chatMessageList: [],
// stompClient: '',
// ws: null,
analogDataList: [],
// analogDataList: [],
currentChatRoom: {},
myStompClient: null,
file: null,
......@@ -72,7 +76,6 @@ export default {
},
props: {
visible: Boolean,
analogData: Array,
stompClient: Object,
currentChatRoomInfo: Object
......@@ -148,31 +151,27 @@ export default {
keepBottom() {
this.$refs.chatContent.scrollTop = this.$refs.chatContent.scrollHeight;
},
listChatroom(data) {
listChatroom(item) {
//取消群聊的订阅
for (const sub in this.stompClient.subscriptions) {
if (sub.startsWith("multicast")) {
if (sub.startsWith("multicastTeam")) {
this.stompClient.unsubscribe(sub);
}
}
data.forEach(e => {
//订阅聊天室主题,订阅功能中设置ID:
this.stompClient.subscribe('/topic/multicast/' + e.id + '/' + e.teamId, data => {
this.chatMessageList.push({
content: JSON.parse(data.body).content,
fromUserId: data.headers.fromUserId,
messageForm: JSON.parse(data.body).messageForm
});
this.$nextTick(() => {
this.keepBottom();
});
}, { id: "multicast" + e.id + new Date().getTime() });
})
this.stompClient.subscribe('/topic/multicast/' + item.id + '/' + item.teamId, data => {
this.chatMessageList.push({
content: JSON.parse(data.body).content,
fromUserId: data.headers.fromUserId,
messageForm: JSON.parse(data.body).messageForm
});
this.$nextTick(() => {
this.keepBottom();
});
}, { id: "multicastTeam" + item.id + new Date().getTime() });
},
getCurrentMessageList(item) {
//查询我方聊天记录
getRecordsByPagingTeam(item.id, 1, 500, '2023-10-01 00:00:00', getTime_extent(0).pre_rq_end, null, item.teamId).then(res1 => {
getRecordsByPagingTeam(item.id, 1, 200, '2023-10-01 00:00:00', getTime_extent(0).pre_rq_end, null, item.teamId).then(res1 => {
this.chatMessageList = res1.records;
this.$nextTick(() => {
this.keepBottom();
......@@ -180,11 +179,11 @@ export default {
})
},
handleDialogOpen() {
this.analogDataList = this.$props.analogData;
// this.analogDataList = this.$props.analogData;
this.currentChatRoom = this.$props.currentChatRoomInfo;
this.myStompClient = this.$props.stompClient;
//订阅
this.listChatroom(this.analogDataList);
this.listChatroom(this.currentChatRoom);
this.getCurrentMessageList(this.$props.currentChatRoomInfo);
},
// 监听输入框内容
......@@ -282,25 +281,50 @@ export default {
.avatarImg {
.otherSidesAvatarImg {
width: 20px;
height: 20px;
margin: 0px 10px;
margin: 5px 10px 0px 10px;
}
.el-imgage {
img {
width: 100%;
height: 100%;
}
.mySidesAvatarImg {
width: 20px;
height: 20px;
margin: 0px 10px;
}
&>div {
max-width: 50%;
padding: 5px 10px;
.otherSides-user {
color: white;
margin-bottom: 5px;
}
.otherSides-text {
border-radius: 5px;
color: black;
margin-bottom: 5px;
padding: 5px 10px;
}
.el-imgage {
img {
width: 100%;
height: 100%;
}
}
}
.mySides-text {
border-radius: 5px;
color: black;
margin-bottom: 5px;
padding: 5px 10px;
}
}
}
}
......
This diff is collapsed.
......@@ -11,7 +11,7 @@
</el-form-item>
<el-form-item label="附件">
<el-upload class="upload-demo" action="" :on-change="handleChange" :on-remove="handleRemove"
:file-list="form.fileList" :auto-upload="false" multiple :accept="formatFile">
:file-list="form.fileList" :auto-upload="false" :accept="formatFile">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">支持导入word,pdf,ppt,mlf,xls!!!</div>
</el-upload>
......@@ -50,15 +50,12 @@ export default {
elDragDialog
},
props: {
visible: Boolean,
stompClient: Object,
currentChatRoomInfo: Object,
analogData: Array
currentChatRoomInfo: Object
},
methods: {
handleClose() {
this.dialogVisible = false;
// this.$emit('handleCancel');
},
showDialog() {
this.dialogVisible = true;
......@@ -81,39 +78,25 @@ export default {
});
},
handleRemove() { },
handleRemove() {
this.form.fileList = [];
},
sendNotice() {
this.myStompClient.send(`/app/sendToChatRoom/${this.currentChatRoom.id}/${this.currentChatRoom.teamId}`, {}, JSON.stringify(this.form));
},
listChatroom(data) {
//取消群聊的订阅
for (const sub in this.stompClient.subscriptions) {
if (sub.startsWith("multicast")) {
this.stompClient.unsubscribe(sub);
}
}
data.forEach(e => {
//订阅聊天室主题,订阅功能中设置ID:
this.stompClient.subscribe('/topic/multicast/' + e.id, data => {
this.$emit('handleCancel');
this.$emit('showInfo', true, this.currentChatRoom);
}, { id: "multicast" + e.id + new Date().getTime() });
})
this.form = {
title: '',
content: '',
attachment: '',
messageForm: null
};
this.handleRemove();
},
handleDialogOpen() {
this.myStompClient = this.$props.stompClient;
this.currentChatRoom = this.$props.currentChatRoomInfo;
this.analogDataList = this.$props.analogData;
this.listChatroom(this.analogDataList);
}
},
// mounted() {
// this.dialogVisible = this.$props.visible;
// this.myStompClient = this.$props.stompClient;
// this.currentChatRoom = this.$props.currentChatRoomInfo;
// this.analogDataList = this.$props.analogData;
// this.listChatroom(this.analogDataList);
// }
}
}
</script>
......
This diff is collapsed.
......@@ -57,9 +57,9 @@
<div class="ta-transfer_btn">
<el-button type="primary" :disabled='item.parameter.selected_num == 0'
@click="removeGoods(index)" icon="el-icon-arrow-left">离席</el-button>
@click="removePeopleFromMeeting(index)" icon="el-icon-arrow-left">离席</el-button>
<el-button type="primary" :disabled='item.invoking.selected_num == 0'
@click='addRemoveGoods(index)'>参会
@click='addPeopleToMeeting(index)'>参会
<i class="el-icon-arrow-right el-icon--right"></i>
</el-button>
</div>
......@@ -193,7 +193,7 @@ export default {
}
);
},
addRemoveGoods(index) { //添加或者删除物品
addPeopleToMeeting(index) { //参会
let formData = this.formData.teams[index].invoking.checkedCities
for (const key in formData) {
for (const k in this.allData) {
......@@ -211,7 +211,7 @@ export default {
this.formData.teams[index].invoking.checkedCities = []
this.formData.teams[index].invoking.checkAll = false
},
removeGoods(index) { //拿出
removePeopleFromMeeting(index) { //离席
let formData = this.formData.teams[index].parameter.checkedCities
for (const key in formData) {
for (const k in this.formData.teams[index].wpinfo) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment