Files
myprojplanet_vite/src/store/Modules/ProgressBar.ts
2021-09-16 21:08:02 +02:00

79 lines
1.6 KiB
TypeScript
Executable File

import { defineStore } from 'pinia'
import { nextTick } from 'vue'
import { dom } from 'quasar'
let TIMER: any = null
let TIMEOUT: any = null
let CUT: any = null
export const useProgressBar = defineStore('ProgressBar', {
state: () => ({
percent: 0,
show: false,
canSuccess: true,
duration: 3000,
height: '2px',
color: '#4975BA',
failedColor: '#c84242',
}),
getters: {},
actions: {
start(): void {
if (!this.show) {
clearTimeout(TIMEOUT)
this.show = true
this.canSuccess = true
if (TIMER) {
clearInterval(TIMER)
this.percent = 0
}
CUT = 20000 / Math.floor(this.duration)
TIMER = setInterval(() => {
this.increase(CUT * Math.random())
if (this.percent > 80) {
this.pause()
}
}, 200)
}
},
set(num: number): void {
this.show = true
this.canSuccess = true
this.percent = Math.floor(num)
},
increase(num: number) {
this.percent += Math.floor(num)
},
decrease(num: number) {
this.percent -= Math.floor(num)
},
finish(): void {
this.percent = 100
this.hide()
},
pause() {
clearInterval(TIMER)
},
hide() {
clearInterval(TIMER)
TIMER = null
TIMEOUT = setTimeout(() => {
this.show = false
this.percent = 0
nextTick(() => {
setTimeout(() => {
this.percent = 0
}, 200)
})
}, 500)
},
fail() {
this.canSuccess = false
this.finish()
},
},
})