feat(portal): 添加AI Call最小化窗口控制功能

- 在app store中新增showAICallMinimized状态用于控制AI Call最小化窗口显示
- 添加对应的mutation和action用于更新最小化窗口显示状态
- 在AICall.vue组件中实现最小化窗口的条件显示逻辑
- 修改case消息组件中的链接跳转方式为路由跳转
- 更新AI聊天接口的请求地址为统一网关路径
- 在App.vue中添加路由监听,根据路由动态控制AI Call窗口显示状态- 实现case和caseDetail路由下显示AI Call最小化窗口的逻辑
This commit is contained in:
陈昱达
2025-09-28 18:07:02 +08:00
parent 47c1d29ef2
commit 8c023d459f
5 changed files with 58 additions and 7 deletions

View File

@@ -23,12 +23,27 @@
},
computed: {
...mapGetters(['userInfo']),
...mapState('app', ['showAICall'])
...mapState('app', ['showAICall', 'showAICallMinimized'])
},
methods: {
onCloseAICall() {
// 通过Vuex关闭AI Call组件
this.$store.dispatch('app/setShowAICall', false);
},
// 检查当前路由是否应该显示AI弹窗
checkRouteForAICall() {
const currentRoute = this.$route.name;
// 只在case或caseDetail路由显示弹窗
if (currentRoute === 'case' || currentRoute === 'caseDetail') {
// 设置最小化窗口显示状态为true
this.$store.dispatch('app/setShowAICallMinimized', true);
} else {
// 其他路由关闭弹窗
this.$store.dispatch('app/setShowAICall', false);
// 设置最小化窗口显示状态为false
this.$store.dispatch('app/setShowAICallMinimized', false);
}
}
},
mounted() {
@@ -37,7 +52,16 @@
// if(this.userInfo && this.userInfo.name!=''){
// this.$watermark.set(this.userInfo.name+this.userInfo.loginName);
// }
// 初始化检查路由
this.checkRouteForAICall();
},
watch: {
// 监听路由变化
$route(to, from) {
this.checkRouteForAICall();
}
}
// watch:{
// userInfo(newVal,oldVal){
// if(newVal && newVal.name!=''){

View File

@@ -9,7 +9,9 @@ const state = {
device: 'desktop',//默认是桌面以后会有android,ios,minapp
size: Cookies.get('size') || 'medium', //字段大小
// 添加AI Call组件显示控制状态
showAICall: false
showAICall: false,
// 控制AI Call最小化窗口在特定路由下显示的状态
showAICallMinimized: false
}
const mutations = {
@@ -40,6 +42,10 @@ const mutations = {
// 添加控制AI Call组件显示的mutation
SET_SHOW_AI_CALL: (state, show) => {
state.showAICall = show
},
// 控制AI Call最小化窗口显示的mutation
SET_SHOW_AI_CALL_MINIMIZED: (state, show) => {
state.showAICallMinimized = show
}
}
@@ -59,6 +65,10 @@ const actions = {
// 添加控制AI Call组件显示的action
setShowAICall({ commit }, show) {
commit('SET_SHOW_AI_CALL', show)
},
// 控制AI Call最小化窗口显示的action
setShowAICallMinimized({ commit }, show) {
commit('SET_SHOW_AI_CALL_MINIMIZED', show)
}
}

View File

@@ -70,7 +70,7 @@
<!-- 最小化状态的弹窗 -->
<div
class="minimized-window"
v-show="windowState === 'minimized'"
v-show="windowState === 'minimized' && showMinimizedWindow"
@click="maximizeWindow"
>
<div class="minimized-content">
@@ -96,6 +96,7 @@
</template>
<script>
import { mapState } from 'vuex'
import messages from './components/messages.vue'
import sendMessage from './components/sendMessage.vue'
@@ -111,6 +112,13 @@ export default {
messages,
sendMessage
},
computed: {
...mapState('app', ['showAICallMinimized']),
showMinimizedWindow() {
// 只有在Vuex状态为true时才显示最小化窗口
return this.showAICallMinimized;
}
},
data() {
return {
AIContent: '',
@@ -428,4 +436,4 @@ export default {
align-items: center;
}
}
</style>
</style>

View File

@@ -49,6 +49,15 @@ export default {
}
},
methods: {
toUrl(item) {
console.log(item);
this.$router.push({
path: '/case/detail',
query: {
id: item.caseId
}
})
},
startTyping(text) {
// 清除之前的定时器
if (this.typingTimer) {
@@ -105,7 +114,7 @@ export default {
<div class="case-refers-list">
<div class="case-refers-item" v-for="item in displayedCaseRefers" :key="item.caseId">
<div class="case-refers-item-title">
<a :href="'#case-' + item.caseId" class="title">{{ item.title }}</a>
<a @click="toUrl(item)" class="title">{{ item.title }}</a>
<span class="case-refers-item-timer">{{item.uploadTime}}</span>
</div>
<div class="case-refers-item-author">

View File

@@ -91,9 +91,9 @@ export default {
conversationId: this.conversationId,
query: question
};
// http://192.168.3.178:9091
// 创建POST请求
fetch('http://192.168.3.178:9091/xboe/m/boe/case/ai/chat',{
fetch('/systemapi/xboe/m/boe/case/ai/chat',{
method: 'POST',
headers: {
'Content-Type': 'application/json'