<div class="global-mask" v-if="isProgress"><div class="contentBox"><div class="progresstitie">數據加載中請稍后</div><el-progress class="progressStyle" :color="customColor" text-color="#fff" :text-inside="true" :stroke-width="20":percentage=percentage status="success"></el-progress><div class="progressSpan">拼命加載中......</div></div></div>fetchData() {this.percentage += 1if (this.percentage == 99) {clearInterval(this.intervalId)}},//開始的時候執行   this.fetchData     this.isProgress= true
//結束的時候         this.isProgress= false/* 遮罩層樣式 */
.global-mask {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);/* 半透明灰色 */z-index: 9998;/* 確保在內容之上 */
}/* 可選：禁止滾動 */
.mask-active {overflow: hidden;height: 100vh;}.contentBox {width: 40%;margin: 0 auto !important;position: absolute;top: 35%;left: 30%;height: 230px;border-radius: 10px;background-image: url("../../../assets/images/loadingBg.png");background-size: cover;}.progressSpan {color: rgb(64, 158, 255);font-size: 16px;text-align: center;padding: 10px 0;}.progressStyle {width: 80%;margin: 0 auto;
}.progresstitie {font-size: 16px;text-align: center;font-weight: 600;font-size: 20px;line-height: 100px;
}