parent
d415f3b8ff
commit
704f9ec888
@ -0,0 +1,294 @@ |
||||
<template> |
||||
<view class="content" v-if="bannerShow"> |
||||
<!-- 弹出层 --> |
||||
<view class="uni-banner"> |
||||
<image src="/static/img/startUpHeader01.png" class="startUpHeaderLogo" /> |
||||
<view class="banner_box"> |
||||
<view class="startUpHeaderBox h6">发现新版本</view> |
||||
<view class="conter">{{ msg }}</view> |
||||
<view class="banner_foot"><button @click="goUpdate(updateApkObj)" class="banner_foot_button">前往升级</button></view> |
||||
</view> |
||||
</view> |
||||
<view class="uni-mask"></view> |
||||
</view> |
||||
</template> |
||||
<script> |
||||
import { comparisonVersionHandler } from '@/common/js/tools'; |
||||
import { getUpgrade } from '@/common/js/apis'; |
||||
|
||||
export default { |
||||
data() { |
||||
return { |
||||
bannerShow: false, // 是否需要強制更新app |
||||
msg: '', // 更新描述 |
||||
type: '', // 设备类型 android:2, ios:1 |
||||
updateApkObj: null // 后台数据 |
||||
}; |
||||
}, |
||||
created() { |
||||
const appUpdate = uni.getStorageSync('platform'); |
||||
// #ifdef APP-PLUS |
||||
this.type = appUpdate == 'android' ? 2 : 1; |
||||
this.checkUpdate(); |
||||
// #endif |
||||
|
||||
}, |
||||
methods: { |
||||
checkUpdate() { |
||||
const self = this, |
||||
localAppVersonName = uni.getStorageSync('version'), |
||||
localAppVerson = uni.getStorageSync('versionCode'); |
||||
|
||||
// #ifdef APP-PLUS |
||||
plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) { |
||||
getUpgrade({ |
||||
appType: self.type |
||||
}).then(res => { |
||||
const { data } = res.data; |
||||
if (res.data.code !== '200') return; |
||||
// 大版本更新 |
||||
if (data.apkVersion && comparisonVersionHandler(localAppVersonName, data.apkVersion.appVersonName)) { |
||||
uni.hideTabBar() |
||||
self.updateApkObj = data.apkVersion; |
||||
self.msg = data.apkVersion.versonLog; |
||||
self.bannerShow = true; |
||||
return; |
||||
// app热更新 |
||||
} else if (data.wgtVersion && comparisonVersionHandler(localAppVerson, data.wgtVersion.appVerson)) { |
||||
self.downloadWgt(data.wgtVersion.downloadUrl); |
||||
return; |
||||
} else { |
||||
return; |
||||
} |
||||
}); |
||||
}); |
||||
// #endif |
||||
}, |
||||
downloadWgt(updateWgtUrl) { |
||||
// 热更新 |
||||
// 下载wgt方法 |
||||
const that = this; |
||||
// 更新文件 wgt 文件地址 |
||||
plus.nativeUI.showWaiting('正在更新...'); |
||||
plus.downloader |
||||
.createDownload( |
||||
updateWgtUrl, |
||||
{ |
||||
filename: '_doc/update/' |
||||
}, |
||||
function(d, status) { |
||||
if (status == 200) { |
||||
that.installWgt(d.filename); // 安装wgt方法 |
||||
} |
||||
plus.nativeUI.closeWaiting(); |
||||
} |
||||
) |
||||
.start(); |
||||
}, |
||||
installWgt(path) { |
||||
// 安装wgt方法 |
||||
plus.nativeUI.showWaiting('安装文件...'); |
||||
plus.runtime.install( |
||||
path, |
||||
{ force: true }, |
||||
function() { |
||||
plus.nativeUI.closeWaiting(); |
||||
plus.nativeUI.alert('应用资源更新完成！', function() { |
||||
plus.runtime.restart(); |
||||
}); |
||||
}, |
||||
function(e) { |
||||
plus.nativeUI.closeWaiting(); |
||||
} |
||||
); |
||||
}, |
||||
goUpdate(updateApkObj) { |
||||
if (this.type == 2) { |
||||
// 弹出系统等待对话框 |
||||
var dtask = plus.downloader.createDownload(updateApkObj.downloadUrl, {}, function(d, status) { |
||||
this.bannerShow = false; |
||||
// 下载完成 |
||||
if (status == 200) { |
||||
plus.runtime.install(plus.io.convertLocalFileSystemURL(d.filename), {}, {}, function(error) { |
||||
uni.showToast({ |
||||
title: '安装失败', |
||||
mask: false, |
||||
duration: 1500 |
||||
}); |
||||
}); |
||||
} else { |
||||
uni.showToast({ |
||||
title: '更新失败', |
||||
mask: false, |
||||
duration: 1500 |
||||
}); |
||||
} |
||||
}); |
||||
try { |
||||
dtask.start(); // 开启下载的任务 |
||||
let prg = 0; |
||||
const showLoading = plus.nativeUI.showWaiting('正在下载'); //创建一个showWaiting对象 |
||||
dtask.addEventListener('statechanged', function(task, status) { |
||||
// 给下载任务设置一个监听 并根据状态 做操作 |
||||
switch (task.state) { |
||||
case 1: |
||||
showLoading.setTitle('正在下载'); |
||||
break; |
||||
case 2: |
||||
showLoading.setTitle('已连接到服务器'); |
||||
break; |
||||
case 3: |
||||
prg = parseInt((parseFloat(task.downloadedSize) / parseFloat(task.totalSize)) * 100); |
||||
showLoading.setTitle(' 正在下载' + prg + '% '); |
||||
break; |
||||
case 4: |
||||
plus.nativeUI.closeWaiting(); |
||||
//下载完成 |
||||
break; |
||||
} |
||||
}); |
||||
} catch (err) { |
||||
plus.nativeUI.closeWaiting(); |
||||
uni.showToast({ |
||||
title: '更新失败-03', |
||||
mask: false, |
||||
duration: 1500 |
||||
}); |
||||
} |
||||
} else if (this.type == 1) { // ios跳转到app store |
||||
plus.runtime.openURL(updateApkObj.downloadUrl); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.content, |
||||
#img { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
|
||||
.content .con { |
||||
font-size: 0; |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
|
||||
|
||||
#info { |
||||
position: absolute; |
||||
top: 0; |
||||
left: 0; |
||||
width: 72rpx; |
||||
height: 72rpx; |
||||
line-height: 72rpx; |
||||
border-radius: 50%; |
||||
background-color: rgba(0, 0, 0, 0.3); |
||||
text-align: center; |
||||
color: #fff; |
||||
font-size: 24rpx; |
||||
} |
||||
|
||||
|
||||
.wrapper { |
||||
width: 36rpx; |
||||
height: 72rpx; |
||||
position: absolute; |
||||
top: 0; |
||||
overflow: hidden; |
||||
} |
||||
|
||||
.right { |
||||
right: 0; |
||||
} |
||||
|
||||
.left { |
||||
left: 0; |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* 弹出层形式的广告 */ |
||||
.uni-banner { |
||||
display: flex; |
||||
align-items: center; |
||||
flex-direction: column; |
||||
position: fixed; |
||||
left: 50%; |
||||
top: 50%; |
||||
z-index: 1000; |
||||
transform: translate(-50%, -50%); |
||||
width: 80%; |
||||
|
||||
.startUpHeaderLogo { |
||||
width: 256rpx; |
||||
height: 194rpx; |
||||
} |
||||
|
||||
.banner_box { |
||||
width: 100%; |
||||
background: #fff; |
||||
border-radius: 20rpx; |
||||
} |
||||
|
||||
.startUpHeaderBox { |
||||
width: 100%; |
||||
height: 96rpx; |
||||
background-image: url('/static/img/startUpHeader02.png'); |
||||
background-position: left top; |
||||
background-repeat: no-repeat; |
||||
background-size: cover; |
||||
} |
||||
} |
||||
|
||||
.banner_box .h6 { |
||||
text-align: center; |
||||
line-height: 96rpx; |
||||
font-size: 36rpx; |
||||
color: #fff; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.banner_box .conter { |
||||
font-size: 28rpx; |
||||
color: #333; |
||||
margin: 48rpx; |
||||
} |
||||
|
||||
.banner_foot { |
||||
width: 238rpx; |
||||
margin: 48rpx auto; |
||||
} |
||||
|
||||
.banner_foot_button { |
||||
background-image: linear-gradient(to right, #3aaf7a, #41bf7f); |
||||
line-height: 72rpx; |
||||
height: 72rpx; |
||||
font-size: 30rpx; |
||||
color: #fff; |
||||
font-weight: bold; |
||||
border-radius: 40rpx; |
||||
border: none; |
||||
box-shadow: 0 8rpx 20rpx 0 rgba(46, 189, 88, 0.36); |
||||
} |
||||
|
||||
.banner_foot_button:active { |
||||
background-image: linear-gradient(to right, #41bf7f, #3aaf7a); |
||||
} |
||||
|
||||
.uni-mask { |
||||
background: rgba(0, 0, 0, 0.6); |
||||
position: fixed; |
||||
width: 100%; |
||||
height: 100%; |
||||
left: 0; |
||||
top: 0; |
||||
z-index: 2; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue