保存

src/ui/components/WindowManager.vue

@@ -0,0 +1,138 @@
+<template>
+  <div class="window-manager">
+    <!-- 所有已打开的内置应用窗口 -->
+    <teleport 
+      v-for="window in builtInWindows" 
+      :key="window.id"
+      :to="`#app-container-${window.appId}`"
+    >
+      <component 
+        :is="window.component"
+        :key="window.id"
+        v-bind="window.props"
+        @close="closeWindow(window.id)"
+      />
+    </teleport>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, inject, onMounted, onUnmounted } from 'vue'
+import type { SystemServiceIntegration } from '@/services/SystemServiceIntegration'
+import { appRegistry } from '@/apps'
+
+interface BuiltInWindow {
+  id: string
+  appId: string
+  component: any
+  props: Record<string, any>
+}
+
+// 存储所有已打开的内置应用窗口
+const builtInWindows = ref<BuiltInWindow[]>([])
+
+// 注入系统服务
+const systemService = inject<SystemServiceIntegration>('systemService')
+
+// 添加内置应用窗口
+const addBuiltInWindow = (windowId: string, appId: string) => {
+  // 检查应用是否存在
+  const appRegistration = appRegistry.getApp(appId)
+  if (!appRegistration) {
+    console.error(`内置应用 ${appId} 不存在`)
+    return
+  }
+
+  // 检查窗口是否已存在
+  const existingWindow = builtInWindows.value.find(w => w.id === windowId)
+  if (existingWindow) {
+    console.warn(`窗口 ${windowId} 已存在`)
+    return
+  }
+
+  // 添加窗口
+  const window: BuiltInWindow = {
+    id: windowId,
+    appId,
+    component: appRegistration.component,
+    props: {
+      windowId,
+      appId
+    }
+  }
+
+  builtInWindows.value.push(window)
+  console.log(`[WindowManager] 添加内置应用窗口: ${appId} (${windowId})`)
+}
+
+// 关闭内置应用窗口
+const closeWindow = (windowId: string) => {
+  const index = builtInWindows.value.findIndex(w => w.id === windowId)
+  if (index > -1) {
+    const window = builtInWindows.value[index]
+    builtInWindows.value.splice(index, 1)
+    console.log(`[WindowManager] 关闭内置应用窗口: ${window.appId} (${windowId})`)
+    
+    // 通知系统服务关闭窗口
+    if (systemService) {
+      const windowService = systemService.getWindowService()
+      windowService.destroyWindow(windowId)
+    }
+  }
+}
+
+// 移除内置应用窗口（不关闭系统窗口）
+const removeBuiltInWindow = (windowId: string) => {
+  const index = builtInWindows.value.findIndex(w => w.id === windowId)
+  if (index > -1) {
+    const window = builtInWindows.value[index]
+    builtInWindows.value.splice(index, 1)
+    console.log(`[WindowManager] 移除内置应用窗口: ${window.appId} (${windowId})`)
+  }
+}
+
+// 监听窗口事件
+let eventUnsubscriber: (() => void) | null = null
+
+onMounted(() => {
+  if (systemService) {
+    const eventService = systemService.getEventService()
+    
+    // 监听内置应用窗口创建事件
+    const subscriberId = eventService.subscribe('system', 'built-in-window-created', (message) => {
+      const { windowId, appId } = message.payload
+      addBuiltInWindow(windowId, appId)
+    })
+    
+    // 监听内置应用窗口关闭事件
+    const closeSubscriberId = eventService.subscribe('system', 'built-in-window-closed', (message) => {
+      const { windowId } = message.payload
+      removeBuiltInWindow(windowId)
+    })
+    
+    eventUnsubscriber = () => {
+      eventService.unsubscribe(subscriberId)
+      eventService.unsubscribe(closeSubscriberId)
+    }
+  }
+})
+
+onUnmounted(() => {
+  if (eventUnsubscriber) {
+    eventUnsubscriber()
+  }
+})
+
+// 暴露给全局使用
+defineExpose({
+  addBuiltInWindow,
+  removeBuiltInWindow,
+  closeWindow
+})
+</script>
+
+<style scoped>
+.window-manager {
+  /* 这个组件本身不需要样式，它只是用来管理 teleport */
+}
+</style>