61 lines
1.2 KiB
TypeScript
61 lines
1.2 KiB
TypeScript
import { defineStore } from 'hooks/store'
|
|
import { Ref, ref } from 'vue'
|
|
|
|
class GlobalLoading {
|
|
loading: Ref<boolean>
|
|
|
|
loadingStack = 0
|
|
|
|
bind(loading: Ref<boolean>) {
|
|
this.loading = loading
|
|
}
|
|
|
|
show() {
|
|
this.loadingStack++
|
|
this.loading.value = true
|
|
}
|
|
|
|
hide() {
|
|
this.loadingStack--
|
|
if (this.loadingStack <= 0) this.loading.value = false
|
|
}
|
|
}
|
|
|
|
export const globalLoading = new GlobalLoading()
|
|
|
|
export const useGlobalLoading = defineStore('loading', () => {
|
|
const loading = ref(false)
|
|
|
|
globalLoading.bind(loading)
|
|
|
|
return { loading }
|
|
})
|
|
|
|
declare module 'hooks/store' {
|
|
interface StoreProvider {
|
|
loading: ReturnType<typeof useGlobalLoading>
|
|
}
|
|
}
|
|
|
|
export const useLoading = () => {
|
|
const targetTimer = ref<Record<string, NodeJS.Timeout | undefined>>({})
|
|
|
|
const show = (target: string = '_default') => {
|
|
targetTimer.value[target] = setTimeout(() => {
|
|
targetTimer.value[target] = undefined
|
|
globalLoading.show()
|
|
}, 200)
|
|
}
|
|
|
|
const hide = (target: string = '_default') => {
|
|
if (targetTimer.value[target]) {
|
|
clearTimeout(targetTimer.value[target])
|
|
targetTimer.value[target] = undefined
|
|
} else {
|
|
globalLoading.hide()
|
|
}
|
|
}
|
|
|
|
return { show, hide }
|
|
}
|