进度浮窗，支持多窗口

ProgressFloatingWindow.js

class FloatingWindow {
  static instanceCount = 0;

  constructor() {
    let body = document.body;

    this.containerDiv = document.createElement('div');
    this.containerDiv.setAttribute('style', 
      `bottom: ${10 + 110 * FloatingWindow.instanceCount}px;`
    );
    this.containerDiv.classList.add('floating-progress-win');

    this.progressBar = document.createElement('progress');
    this.progressBar.setAttribute('value', '0');
    this.progressBar.setAttribute('max', '100');

    this.titleDiv = document.createElement('div');
    this.titleDiv.classList.add('floating-progress-win-title');
    this.textDiv = document.createElement('div');
    this.textDiv.classList.add('floating-progress-win-text');

    this.styleDiv = document.createElement('style');
    this.styleDiv.innerHTML=`.floating-progress-win {
    z-index: 9999;
    width: 227px;
    height: 80px;
    padding: 0;
    background-color: #ffffffb8;
    position: fixed;
    right: 20px;
    bottom: 10px;
    border-radius: 4px;
    overflow: hidden;
    backdrop-filter: blur(10px);
    box-shadow: 1px 2px 3px #00000061;
}

.floating-progress-win-title {
    font-size: 14px;
    padding: 4px 10px 0;
    font-weight: 700;
}

.floating-progress-win-text {
    padding: 0 10px;
}

.floating-progress-win > progress {
    width: 100%;
    height: 4px;
    bottom: 0;
    position: absolute;
}
       
.floating-progress-win > progress::-webkit-progress-value {
    background: #008effb0;
}

.floating-progress-win > progress::-webkit-progress-bar  {
    background: #87878754;
}`
    this.containerDiv.appendChild(this.styleDiv);
    this.containerDiv.appendChild(this.titleDiv);
    this.containerDiv.appendChild(this.textDiv);
    this.containerDiv.appendChild(this.progressBar);
    body.appendChild(this.containerDiv);
    
    FloatingWindow.instanceCount++;
  }

  setTitle(title) {
    this.titleDiv.innerText = title;
  }

  setText(text) {
    this.textDiv.innerText = text;
  }

  setProgress(percentage) {
    this.progressBar.setAttribute('value', percentage);
  }

  remove() {
    this.containerDiv.remove();
    FloatingWindow.instanceCount--;
  }
}