|
|
@@ -58,6 +58,17 @@
|
|
|
<text class="logout-btn" @click="handleLogout">退出</text>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
+
|
|
|
+ <!-- 下载进度遮罩（仅更新数据不重建，无闪烁） -->
|
|
|
+ <view v-if="isDownload" class="download-progress-mask">
|
|
|
+ <view class="download-progress-box">
|
|
|
+ <text class="download-progress-title">下载中...</text>
|
|
|
+ <view class="download-progress-bar">
|
|
|
+ <view class="download-progress-fill" :style="{ width: downloadProgress + '%' }"></view>
|
|
|
+ </view>
|
|
|
+ <text class="download-progress-text">{{ downloadProgress }}%</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -81,6 +92,8 @@
|
|
|
const userRole = ref<string>('')
|
|
|
const isNewVersion = ref<boolean>(false)
|
|
|
const nickName = ref<string>('')
|
|
|
+ const isDownload = ref<boolean>(false)
|
|
|
+ const downloadProgress = ref<number>(0)
|
|
|
|
|
|
// 版本信息
|
|
|
const manifestVersion = manifest.versionName as string | null
|
|
|
@@ -259,11 +272,8 @@
|
|
|
|
|
|
const installApkWithProgress = (): void => {
|
|
|
// #ifdef APP-ANDROID
|
|
|
- // 显示下载进度
|
|
|
- uni.showLoading({
|
|
|
- title: '下载中...',
|
|
|
- mask: true
|
|
|
- });
|
|
|
+ isDownload.value = true;
|
|
|
+ downloadProgress.value = 0;
|
|
|
let donwloadUrl = '';
|
|
|
donwloadUrl = getBaseUrl() + '/profile/app/gxt-release-'+versionServer.value+'.apk'
|
|
|
|
|
|
@@ -272,6 +282,7 @@
|
|
|
url: donwloadUrl,
|
|
|
filePath: `${uni.env.USER_DATA_PATH}/${Date.now()}_test.apk`, // 使用时间戳防止重名
|
|
|
success: (downloadRes) => {
|
|
|
+ isDownload.value = false;
|
|
|
if (downloadRes.statusCode == 200) {
|
|
|
// 确认安装
|
|
|
uni.showModal({
|
|
|
@@ -289,10 +300,9 @@
|
|
|
icon: 'error'
|
|
|
});
|
|
|
}
|
|
|
- uni.hideLoading();
|
|
|
},
|
|
|
fail: (error) => {
|
|
|
- uni.hideLoading();
|
|
|
+ isDownload.value = false;
|
|
|
uni.showToast({
|
|
|
title: '下载失败',
|
|
|
icon: 'none'
|
|
|
@@ -301,14 +311,14 @@
|
|
|
}
|
|
|
});
|
|
|
|
|
|
- // 监听下载进度
|
|
|
+ // 监听下载进度（更新页面内进度条，节流 5% 减轻渲染压力）
|
|
|
+ let lastProgress = -5;
|
|
|
downloadTask.onProgressUpdate((res) => {
|
|
|
- console.log('下载进度:', res.progress + '%');
|
|
|
- // 如果需要，可以更新UI显示进度
|
|
|
- // uni.showLoading({
|
|
|
- // title: `下载中...`,
|
|
|
- // mask: true
|
|
|
- // });
|
|
|
+ const p = Math.round(res.progress);
|
|
|
+ if (p - lastProgress >= 5 || p >= 100) {
|
|
|
+ lastProgress = p;
|
|
|
+ downloadProgress.value = p;
|
|
|
+ }
|
|
|
});
|
|
|
// #endif
|
|
|
// #ifdef APP-HARMONY
|
|
|
@@ -543,4 +553,46 @@
|
|
|
padding: 20rpx 0;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .download-progress-mask {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background-color: rgba(0, 0, 0, 0.5);
|
|
|
+ z-index: 999;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+ .download-progress-box {
|
|
|
+ width: 500rpx;
|
|
|
+ padding: 60rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .download-progress-title {
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #333333;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ }
|
|
|
+ .download-progress-bar {
|
|
|
+ width: 100%;
|
|
|
+ height: 16rpx;
|
|
|
+ background-color: #f0f0f0;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ .download-progress-fill {
|
|
|
+ height: 100%;
|
|
|
+ background-color: #0081ff;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ transition: width 0.2s ease;
|
|
|
+ }
|
|
|
+ .download-progress-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
</style>
|
wuhb