12

app/components/liveMinWindow/createMinWindow.js

@@ -0,0 +1,56 @@
+import { createApp } from 'vue'
+import MinWindow from '@/components/liveMinWindow/index.vue'
+
+let minWindowInstance = null
+
+// 创建悬浮窗
+export const showMinWindow = (snapshot, props = {}) => {
+  if (minWindowInstance) {
+    hideMinWindow()
+  }
+
+  const container = document.createElement('div')
+  container.id = 'live-min-window-container'
+  document.body.appendChild(container)
+
+  const defaultProps = {
+    snapshot,
+    onClose: () => hideMinWindow(),
+    initialPosition: {
+      top: '80px',
+      right: '16px'
+    }
+  }
+
+  const app = createApp(MinWindow, {
+    ...defaultProps,
+    ...props
+  })
+
+  app.config.errorHandler = (err) => {
+    console.error('MinWindow Error:', err)
+    hideMinWindow()
+  }
+
+  minWindowInstance = app.mount(container)
+  return minWindowInstance
+}
+
+export const hideMinWindow = () => {
+  if (!minWindowInstance) return
+
+  const el = minWindowInstance.$el
+  el.style.transform = 'translateY(100%)'
+  el.style.opacity = '0'
+
+  const cleanup = () => {
+    el.parentNode?.remove()
+    minWindowInstance = null
+  }
+  
+  if (document.startViewTransition) {
+    document.startViewTransition(() => cleanup())
+  } else {
+    setTimeout(cleanup, 300)
+  }
+}