perf: 优化消息窗口显示

This commit is contained in:
kuaifan 2025-04-03 22:03:41 +08:00
parent 0c9c9cb90a
commit 82fddefc94
16 changed files with 107 additions and 326 deletions

View File

@ -217,7 +217,6 @@ export default {
case 'message':
this.$store.dispatch("openDialog", item.id).then(() => {
this.onHide()
this.$store.state.dialogSearchMsgId = /^\d+$/.test(item.rawData.search_msg_id) ? item.rawData.search_msg_id : 0
}).catch(({msg}) => {
$A.modalError(msg || this.$L('打开会话失败'))
@ -225,9 +224,7 @@ export default {
break;
case 'contact':
this.$store.dispatch("openDialogUserid", item.id).then(_ => {
this.onHide()
}).catch(({msg}) => {
this.$store.dispatch("openDialogUserid", item.id).catch(({msg}) => {
$A.modalError(msg || this.$L('打开会话失败'))
});
break;

View File

@ -285,7 +285,7 @@
<!--任务详情-->
<TaskModal ref="taskModal"/>
<!--聊天窗口移动端-->
<!--聊天窗口-->
<DialogModal ref="dialogModal"/>
<!--搜索框-->

View File

@ -542,9 +542,7 @@ export default {
},
//
chatMybot(userid) {
this.$store.dispatch("openDialogUserid", userid).then(route => {
route && (this.mybotShow = false)
}).catch(({msg}) => {
this.$store.dispatch("openDialogUserid", userid).catch(({msg}) => {
$A.modalError(msg || this.$L('打开会话失败'))
});
},
@ -629,15 +627,14 @@ export default {
//
onGoToChat(type) {
let dialogId = 0;
this.cacheDialogs.map(h => {
this.cacheDialogs.some(h => {
if (h.email == `ai-${type}@bot.system`) {
dialogId = h.id;
return true;
}
})
if (dialogId) {
this.$store.dispatch("openDialog", dialogId).then(route => {
route && (this.aibotShow = false)
})
this.$store.dispatch("openDialog", dialogId)
return
}
//
@ -646,9 +643,7 @@ export default {
url: 'users/search/ai',
data: {type},
}).then(({data}) => {
this.$store.dispatch("openDialogUserid", data.userid).then(route => {
route && (this.aibotShow = false)
}).catch(({ msg }) => {
this.$store.dispatch("openDialogUserid", data.userid).catch(({ msg }) => {
$A.modalError(msg)
}).finally(_ => {
this.aibotDialogSearchLoad = '';
@ -739,15 +734,18 @@ export default {
},
//
goWordChainAndVote() {
const dialog_id = Number(this.sendData[0].replace('d:', ''))
this.$store.dispatch("openDialog", dialog_id).then(async () => {
try {
await $A.waitForCondition(() => this.routeLoading === 0);
return new Promise((resolve, reject) => {
if (this.sendData.length === 0) {
$A.messageError("请选择对话或成员");
reject()
return
}
const dialog_id = Number(this.sendData[0].replace('d:', ''))
this.$store.dispatch("openDialog", dialog_id).then(async () => {
const type = this.sendType == 'word-chain' ? 'dialogDroupWordChain' : 'dialogGroupVote'
this.$store.state[type] = {type: 'create', dialog_id: dialog_id}
} catch (error) {
// Handle the error
}
})
resolve()
})
}
}

View File

@ -17,7 +17,7 @@
<Tag v-if="datas.state == 3" color="red">{{$L('已拒绝')}}</Tag>
<Tag v-if="datas.state == 4" color="red">{{$L('已撤回')}}</Tag>
</h2>
<h3 class="approve-details-subtitle">
<h3 class="approve-details-subtitle" @click="onAvatar(datas.start_user_id)">
<Avatar :src="datas.userimg" size="24"/>
<span>{{datas.start_user_name}}</span>
</h3>
@ -516,19 +516,7 @@ export default {
if (!/^\d+$/.test(userid)) {
return
}
this.$store.dispatch("openDialogUserid", userid).then(route => {
if (!route) {
return;
}
switch (this.$parent.$options.name) {
case "DrawerOverlayView":
this.$parent.onClose()
break;
case "Modal":
this.$parent.close()
break;
}
}).catch(({msg}) => {
this.$store.dispatch("openDialogUserid", userid).catch(({msg}) => {
$A.modalError(msg)
});
}

View File

@ -75,7 +75,7 @@ export default {
watch: {
dialogId(id) {
this.show = id > 0 && this.routeName !== 'manage-messenger'
this.show = id > 0 && (this.windowPortrait || this.routeName !== 'manage-messenger')
},
show(v) {
@ -91,9 +91,8 @@ export default {
return new Promise(async _ => {
this.closIng++
await this.$store.dispatch("openDialog", 0)
setTimeout(() => {
this.closIng--
}, 300)
await new Promise(resolve => setTimeout(resolve, 300))
this.closIng--
})
},
}

View File

@ -2568,6 +2568,7 @@ export default {
return;
}
if (this.windowPortrait) {
//
this.$store.dispatch("openDialog", 0);
}
this.goForward({name: 'manage-project', params: {projectId:this.dialogData.group_info.id}});
@ -2647,7 +2648,7 @@ export default {
onDialogMenu(cmd) {
switch (cmd) {
case "single":
this.$store.dispatch('openDialog', {dialog_id: this.dialogData.id, single: true});
this.$store.dispatch('openDialog', {dialog_id: this.dialogData.id});
break;
case "searchMsg":

View File

@ -1,86 +0,0 @@
<template>
<DialogWrapper v-if="dialogShow" :dialog-id="projectData.dialog_id" class="project-dialog">
<template slot="head">
<div class="dialog-user">
<div class="member-head">
<div class="member-title">{{$L('项目成员')}}<span @click="memberShowAll=!memberShowAll">({{projectData.project_user.length}})</span></div>
<ETooltip v-if="$Electron" :disabled="$isEEUiApp || windowTouch" :content="$L('独立窗口显示')">
<div class="member-open" @click="onOpenDialog">
<i class="taskfont open-dialog">&#xe776;</i>
</div>
</ETooltip>
<ETooltip v-else :disabled="$isEEUiApp || windowTouch" :content="$L('在消息中显示')">
<div class="member-open" @click="onMsgOpen">
<Icon type="ios-chatbubbles-outline"/>
</div>
</ETooltip>
<div class="member-close" @click="onClose">
<Icon type="ios-close"/>
</div>
</div>
<ul :class="['member-list', memberShowAll ? 'member-all' : '']">
<li v-for="item in projectData.project_user">
<UserAvatar :userid="item.userid" :size="36"/>
</li>
</ul>
</div>
<div class="nav-wrapper">
<div class="dialog-title">
<h2>{{$L('群聊')}}</h2>
</div>
</div>
</template>
</DialogWrapper>
</template>
<script>
import {mapGetters} from "vuex";
import DialogWrapper from "./DialogWrapper";
export default {
name: "ProjectDialog",
components: {DialogWrapper},
data() {
return {
loadIng: false,
memberShowAll: false,
beforeDestroyClose: false,
}
},
beforeDestroy() {
if (this.beforeDestroyClose) {
requestAnimationFrame(this.toggleParameter)
}
},
computed: {
...mapGetters(['projectData']),
dialogShow() {
return this.windowLandscape && this.projectData.dialog_id && this.projectData.cacheParameter.chat
}
},
methods: {
onMsgOpen() {
this.$store.dispatch("openDialog", this.projectData.dialog_id);
this.beforeDestroyClose = true;
},
onOpenDialog() {
this.$store.dispatch('openDialog', {dialog_id: this.projectData.dialog_id, single: true});
this.toggleParameter();
},
onClose() {
this.$emit('on-close');
this.toggleParameter();
},
toggleParameter() {
this.$store.dispatch('toggleProjectParameter', 'chat');
},
}
}
</script>

View File

@ -1705,11 +1705,10 @@ export default {
toggleParameter(data) {
if (data === 'chat') {
if (this.windowPortrait) {
this.$store.dispatch('openDialog', this.projectData.dialog_id)
return;
}
} else if (data === 'completedTask') {
this.$store.dispatch('openDialog', this.projectData.dialog_id)
return;
}
if (data === 'completedTask') {
this.$store.dispatch("forgetTaskCompleteTemp", true);
}
this.$store.dispatch('toggleProjectParameter', data);

View File

@ -1311,9 +1311,7 @@ export default {
if ($A.leftExists(val, 'dialog_')) {
const dialogId = parseInt(val.substr(7))
this.$store.dispatch("openDialog", dialogId).then(() => {
this.$emit('on-close')
}).catch(({msg}) => {
this.$store.dispatch("openDialog", dialogId).catch(({msg}) => {
$A.modalError(msg || this.$L('打开会话失败'))
})
return;

View File

@ -550,13 +550,6 @@ export default {
if (['dialog', 'contacts'].includes(params.dialogAction)) {
this.tabActive = params.dialogAction
}
if (params.dialog_id) {
this.tabActive = 'dialog'
const id = $A.runNum(params.dialog_id);
if (id > 0) {
this.openDialog(id)
}
}
},
immediate: true
},
@ -769,9 +762,9 @@ export default {
this.$store.dispatch("openDialogUserid", $A.leftDelete(dialogId.dialog_id, "u:")).catch(({msg}) => {
$A.modalError(msg)
})
} else {
this.$store.dispatch("openDialog", dialogId)
return;
}
this.$store.dispatch("openDialog", dialogId)
},
openContacts(user) {
@ -779,11 +772,7 @@ export default {
return
}
this.$set(user, 'loading', true);
this.$store.dispatch("openDialogUserid", user.userid).then(_ => {
if (this.windowLandscape) {
this.tabActive = 'dialog';
}
}).catch(({msg}) => {
this.$store.dispatch("openDialogUserid", user.userid).catch(({msg}) => {
$A.modalError(msg)
}).finally(_ => {
this.$set(user, 'loading', false);
@ -1130,7 +1119,7 @@ export default {
break;
case 'single':
this.$store.dispatch('openDialog', {dialog_id: this.operateItem.id, single: true});
this.$store.dispatch('openDialog', this.operateItem.id);
break;
case 'hide':

View File

@ -1,9 +1,6 @@
<template>
<div class="page-project">
<template v-if="projectId > 0">
<ProjectPanel ref="panel"/>
<ProjectDialog @on-close="onDialogClose"/>
</template>
<ProjectPanel v-if="projectId > 0" ref="panel"/>
<ProjectList v-if="windowPortrait" v-show="projectId === 0"/>
</div>
</template>
@ -11,10 +8,9 @@
<script>
import {mapState} from "vuex";
import ProjectPanel from "./components/ProjectPanel";
import ProjectDialog from "./components/ProjectDialog";
import ProjectList from "./components/ProjectList";
export default {
components: {ProjectList, ProjectDialog, ProjectPanel},
components: {ProjectList, ProjectPanel},
deactivated() {
this.$store.dispatch("forgetTaskCompleteTemp", true);
@ -73,10 +69,6 @@ export default {
});
this.$store.dispatch("forgetTaskCompleteTemp", true);
});
},
onDialogClose() {
this.$refs.panel?.handleColumnDebounce();
}
}
}

View File

@ -77,7 +77,7 @@ export default {
}
}
//
if (this.windowPortrait && this.dialogId > 0){
if (this.windowPortrait){
this.$store.dispatch("openDialog", 0)
}
//

View File

@ -471,6 +471,7 @@ export default {
}
dispatch('openTask', 0)
if (state.windowPortrait) {
// 如果是宽屏则关闭对话窗口
dispatch("openDialog", 0);
}
$A.goForward({name: 'manage-file', params: data});
@ -2944,19 +2945,19 @@ export default {
* 获取单个会话信息
* @param state
* @param dispatch
* @param dialog_id
* @param dialogId
* @returns {Promise<unknown>}
*/
getDialogOne({state, dispatch}, dialog_id) {
getDialogOne({state, dispatch}, dialogId) {
return new Promise(function (resolve, reject) {
if ($A.runNum(dialog_id) === 0) {
if ($A.runNum(dialogId) === 0) {
reject({msg: 'Parameter error'});
return;
}
dispatch("call", {
url: 'dialog/one',
data: {
dialog_id,
dialog_id: dialogId,
},
}).then(result => {
dispatch("saveDialog", result.data);
@ -2973,28 +2974,28 @@ export default {
* @param commit
* @param state
* @param dispatch
* @param dialog_id
* @param dialogId
*/
getDialogTodo({commit, state, dispatch}, dialog_id) {
getDialogTodo({commit, state, dispatch}, dialogId) {
dispatch("call", {
url: 'dialog/todo',
data: {
dialog_id,
dialog_id: dialogId,
},
}).then(({data}) => {
if ($A.arrayLength(data) > 0) {
if (dialog_id > 0) {
if (dialogId > 0) {
dispatch("saveDialog", {
id: dialog_id,
id: dialogId,
todo_num: $A.arrayLength(data)
});
commit("dialog/todo/save", state.dialogTodos.filter(item => item.dialog_id != dialog_id))
commit("dialog/todo/save", state.dialogTodos.filter(item => item.dialog_id != dialogId))
}
dispatch("saveDialogTodo", data)
} else {
if (dialog_id > 0) {
if (dialogId > 0) {
dispatch("saveDialog", {
id: dialog_id,
id: dialogId,
todo_num: 0
});
}
@ -3006,13 +3007,13 @@ export default {
* 获取会话消息置顶
* @param state
* @param dispatch
* @param dialog_id
* @param dialogId
*/
getDialogMsgTop({state, dispatch}, dialog_id) {
getDialogMsgTop({state, dispatch}, dialogId) {
dispatch("call", {
url: 'dialog/msg/topinfo',
data: {
dialog_id,
dialog_id: dialogId,
},
}).then(({data}) => {
if ($A.isJson(data)) {
@ -3025,28 +3026,28 @@ export default {
* 打开会话
* @param state
* @param dispatch
* @param dialog_id
* @param dialogId
* @returns {Promise<unknown>}
*/
openDialog({state, dispatch}, dialog_id) {
openDialog({state, dispatch}, dialogId) {
return new Promise(async (resolve, reject) => {
let single_window = $A.isSubElectron || (state.isModKey && $A.Electron)
let search_msg_id;
let dialog_msg_id;
if ($A.isJson(dialog_id)) {
single_window = single_window || (dialog_id.single && $A.Electron);
search_msg_id = dialog_id.search_msg_id;
dialog_msg_id = dialog_id.dialog_msg_id;
dialog_id = dialog_id.dialog_id;
let singleWindow = state.routeName !== 'manage-messenger',
searchMsgId = 0,
dialogMsgId = 0;
if ($A.isJson(dialogId)) {
singleWindow = singleWindow || !!dialogId.single;
searchMsgId = dialogId.search_msg_id;
dialogMsgId = dialogId.dialog_msg_id;
dialogId = dialogId.dialog_id;
}
search_msg_id = /^\d+$/.test(search_msg_id) ? parseInt(search_msg_id) : 0;
dialog_msg_id = /^\d+$/.test(dialog_msg_id) ? parseInt(dialog_msg_id) : 0;
dialog_id = /^\d+$/.test(dialog_id) ? parseInt(dialog_id) : 0;
searchMsgId = /^\d+$/.test(searchMsgId) ? parseInt(searchMsgId) : 0;
dialogMsgId = /^\d+$/.test(dialogMsgId) ? parseInt(dialogMsgId) : 0;
dialogId = /^\d+$/.test(dialogId) ? parseInt(dialogId) : 0;
//
if (dialog_id > 0 && state.cacheDialogs.findIndex(item => item.id == dialog_id) === -1) {
if (dialogId > 0 && state.cacheDialogs.findIndex(item => item.id == dialogId) === -1) {
dispatch("showSpinner", 300)
try {
await dispatch("getDialogOne", dialog_id)
await dispatch("getDialogOne", dialogId)
} catch (e) {
reject(e);
return;
@ -3055,22 +3056,54 @@ export default {
}
}
//
if (single_window) {
dispatch('openDialogNewWindow', dialog_id);
resolve(false)
if ($A.Electron && singleWindow) {
dispatch('openDialogNewWindow', dialogId);
resolve()
return
}
//
requestAnimationFrame(_ => {
state.dialogSearchMsgId = search_msg_id;
state.dialogMsgId = dialog_msg_id;
state.dialogId = dialog_id;
const route = dialog_id > 0 && state.windowLandscape
resolve(route)
state.dialogSearchMsgId = searchMsgId;
state.dialogMsgId = dialogMsgId;
state.dialogId = dialogId;
resolve()
})
})
},
/**
* 打开会话通过会员ID打开个人会话
* @param state
* @param dispatch
* @param userid
*/
openDialogUserid({state, dispatch}, userid) {
return new Promise((resolve, reject) => {
const dialog = state.cacheDialogs.find(item => {
if (item.type !== 'user' || !item.dialog_user) {
return false
}
return item.dialog_user.userid === userid
});
if (dialog) {
return dispatch("openDialog", dialog.id).then(resolve).catch(reject)
}
dispatch("call", {
url: 'dialog/open/user',
data: {
userid,
},
spinner: 600
}).then(async ({data}) => {
dispatch("saveDialog", data);
dispatch("openDialog", data.id).then(resolve).catch(reject)
}).catch(e => {
console.warn(e);
reject(e);
})
});
},
/**
* 打开会话客户端新窗口
* @param state
@ -3093,41 +3126,6 @@ export default {
});
},
/**
* 打开会话通过会员ID打开个人会话
* @param state
* @param dispatch
* @param userid
*/
openDialogUserid({state, dispatch}, userid) {
return new Promise(async (resolve, reject) => {
const dialog = state.cacheDialogs.find(item => {
if (item.type !== 'user' || !item.dialog_user) {
return false
}
return item.dialog_user.userid === userid
});
if (dialog) {
const route = await dispatch("openDialog", dialog.id);
return resolve(route);
}
dispatch("call", {
url: 'dialog/open/user',
data: {
userid,
},
spinner: 600
}).then(async ({data}) => {
dispatch("saveDialog", data);
const route = await dispatch("openDialog", data.id);
resolve(route);
}).catch(e => {
console.warn(e);
reject(e);
})
});
},
/**
* 忘记对话数据
* @param commit

View File

@ -9,7 +9,6 @@
@import "general-operation";
@import "meeting-manager";
@import "project-archived";
@import "project-dialog";
@import "project-gantt";
@import "project-list";
@import "project-log";

View File

@ -1,83 +0,0 @@
.project-dialog {
display: flex;
flex-direction: column;
background-color: #ffffff;
border-left: 1px solid #f4f5f5;
z-index: 1;
position: relative;
.dialog-user {
margin-top: 26px;
.member-head {
display: flex;
align-items: center;
padding: 0 14px 0 22px;
.member-title {
flex: 1;
font-size: 18px;
font-weight: 600;
padding-right: 12px;
> span {
padding-left: 6px;
color: $primary-color;
cursor: pointer;
}
}
.member-open {
cursor: pointer;
margin-right: 8px;
.open-dialog {
font-size: 24px;
}
.ivu-icon-ios-chatbubbles-outline {
font-size: 22px;
}
}
.member-close {
cursor: pointer;
.ivu-icon-ios-close {
font-size: 38px;
transition: all 0.2s;
}
&:hover {
.ivu-icon-ios-close {
transform: rotate(-90deg);
}
}
}
}
.member-list {
display: flex;
align-items: center;
margin-top: 12px;
padding: 0 22px;
overflow: auto;
&::-webkit-scrollbar {
display: none;
}
> li {
position: relative;
list-style: none;
margin-right: 10px;
margin-bottom: 8px;
}
&.member-all {
display: block;
> li {
display: inline-block;
overflow: hidden;
}
}
}
}
.dialog-nav {
.nav-wrapper {
padding: 0 20px;
}
}
}

View File

@ -8,14 +8,6 @@
height: 100%;
background-color: #fafafa;
}
.project-dialog {
position: relative;
height: 100%;
width: 35%;
min-width: 320px;
max-width: 520px;
flex-shrink: 0;
}
}
@media (max-height: 700px) {