<template>
<u-popup v-model="isShow" mode="center" border-radius="16" :mask-close-able="false">
<view class="update-box">
<view class="title">{{'发现新版本'}}</view>
<textarea class="content" disabled :value="content"></textarea>
<view class="cu-progress sm striped active" v-if="loading > 0">
<view class="bg-theme" :style="[{ width: loading+'%'}]"></view>
</view>
<view class="foot solid-top">
<view class="flex-sub text-gray solid-right" @click="handleCancel">{{'下次再说'}}</view>
<view class="flex-sub text-green" @click="handleConfirm">{{'马上更新'}}</view>
</view>
</view>
</u-popup>
</template>
<script>
/**
* author: SSJ
* @description app检测升级组件
* @param {boolean} auto 是否自动检测更新
* **/
// import {
// API_BASE_URL,
// SYSTEM_CONFIG
// } from '@/common/config.js';
// import {app_url} from '@/api/api.js'
export default {
props: {
auto: {
type: Boolean,
default: false
}, // 是否自动检测更新
},
data() {
return {
isShow: false,
content: "",
apkUrl: "",
loading: 0,
isLoad: false,
downloadTask: null,
};
},
methods: {
checkAppUpdate() {
console.log("检查更新");
// 获取手机当前版本信息
const _platform = uni.getSystemInfoSync().platform;
const self = this;
plus.runtime.getProperty(plus.runtime.appid, async function(widgetInfo) {
console.log('本地版本信息', widgetInfo);
// 请求版本检查接口
// const [error, result] = await uni.request({
// url: API_BASE_URL + global.apiUrls.publicUpdateAPP,
// header: {
// 'content-type': 'application/x-www-form-urlencoded'
// },
// data: {
// app_ident: 'user',
// client: SYSTEM_CONFIG.platform === 'Android' ? 3 : 2,
// },
// method: 'POST',
// });
// console.log(error, result, 'error')
const result = await app_url()
if (result.code == 1) {
const data = result.data;
console.log('接口信息', data);
// if (data.is_take == 1) {
console.log("是有效的版本");
console.log("是热更新", widgetInfo.versionCode);
if (Number(data.version) > Number(widgetInfo.versionCode)) {
uni.showModal({
title: '提示',
content: '已准备好新版本,是否重启体验新版?',
confirmText: '重启',
cancelText: '取消',
showCancel: true,
success: res => {
if (res.confirm) {
uni.showLoading({
title: '更新中',
mask: true
});
uni.downloadFile({
url: data.url,
success: (downloadResult) => {
console.log(downloadResult,'sopsopsop')
uni.hideLoading();
if (downloadResult.statusCode === 200) {
plus.runtime.install(downloadResult.tempFilePath, {
force: true
}, function(){
setTimeout(function() {
plus.runtime.restart();
}, 1000);
});
}
}
})
}
}
})
}else{
if (!self.auto) {
self.utils.toast('已是最新版本')
}
}
// }
}
});
},
// 取消
handleCancel() {
this.downloadTask && this.downloadTask.abort();
this.isShow = false;
},
// 确定
handleConfirm() {
if (plus.os.name.toLowerCase() === 'android') {
console.log("是安卓系统");
if (this.isLoad) return;
this.isLoad = true;
this.downloadTask = uni.downloadFile({
url: this.apkUrl,
success: (downloadResult) => {
console.log('downloadResult 下载成功', downloadResult);
if (downloadResult.statusCode == 200) {
this.isShow = false;
plus.runtime.install(downloadResult.tempFilePath, {
force: true
});
plus.runtime.restart();
}
},
fail: (err) => {
console.log('ERROR', err);
if (err.errMsg == 'downloadFile:fail abort') {
self.utils.toast('取消下载')
} else {
self.utils.toast('下载失败')
}
},
complete: () => {
this.isLoad = false;
}
});
this.downloadTask.onProgressUpdate(res => {
this.loading = res.progress;
});
} else {
console.log("是苹果系统,跳转到苹果应用商店");
plus.runtime.openURL(this.apkUrl);
}
},
},
created() {
// #ifdef APP-PLUS
if (this.auto) {
setTimeout(() => {
this.checkAppUpdate();
}, 2500);
}
// #endif
}
}
</script>
<style lang="scss" scoped>
.update-box {
width: 500rpx;
background-color: #FFFFFF;
.title {
height: 100rpx;
line-height: 100rpx;
text-align: center;
font-size: 32rpx;
color: #333333;
}
.content {
width: 100%;
height: 500rpx;
padding: 0 32rpx 32rpx 32rpx;
box-sizing: border-box;
}
.foot {
height: 80rpx;
display: flex;
line-height: 80rpx;
text-align: center;
}
}
</style>
uniapp热更新组件(复制直接可用)
最新推荐文章于 2024-09-25 09:57:31 发布