55 lines
1.1 KiB
JavaScript
55 lines
1.1 KiB
JavaScript
|
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) => {
|
||
|
|
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)
|
||
|
|
}
|
||
|
|
}
|