|
@@ -1,430 +0,0 @@
|
|
-<template>
|
|
|
|
- <view class="wrap" v-if="popup_show">
|
|
|
|
- <view class="popup-bg" :style="getHeight">
|
|
|
|
- <view class="popup-content" :class="{ 'popup-content-show': popup_show }">
|
|
|
|
- <view class="update-wrap">
|
|
|
|
- <image src="./images/img.png" class="top-img"></image>
|
|
|
|
- <view class="content">
|
|
|
|
- <text class="title">{{ $t(`发现新版本`) }}{{ update_info.version }}</text>
|
|
|
|
- <!-- 升级描述 -->
|
|
|
|
- <view class="title-sub" v-html="update_info.info"></view>
|
|
|
|
- <!-- 升级按钮 -->
|
|
|
|
- <button class="btn" v-if="downstatus < 1" @click="nowUpdate()">
|
|
|
|
- {{ $t(`立即升级`) }}
|
|
|
|
- </button>
|
|
|
|
- <!-- 下载进度 -->
|
|
|
|
- <view class="sche-wrap" v-else>
|
|
|
|
- <!-- 更新包下载中 -->
|
|
|
|
- <view class="sche-bg">
|
|
|
|
- <view class="sche-bg-jindu" :style="lengthWidth"></view>
|
|
|
|
- </view>
|
|
|
|
- <text class="down-text">{{ $t(`下载进度`) }}:{{ (downSize / 1024 / 1024).toFixed(2) }}M/{{
|
|
|
|
- (fileSize / 1024 / 1024).toFixed(2)
|
|
|
|
- }}M</text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <image src="./images/close.png" class="close-ioc" @click="closeUpdate()"></image>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<script>
|
|
|
|
-let vm;
|
|
|
|
-import {
|
|
|
|
- getUpdateInfo
|
|
|
|
-} from '@/api/public.js'
|
|
|
|
-
|
|
|
|
-export default {
|
|
|
|
- name: "appUpdate",
|
|
|
|
- //@是否强制更新
|
|
|
|
- props: {
|
|
|
|
- tabbar: {
|
|
|
|
- type: Boolean,
|
|
|
|
- default: false, //是否有原生tabbar组件
|
|
|
|
- },
|
|
|
|
- getVer: {
|
|
|
|
- type: Boolean,
|
|
|
|
- default: false, //是否有原生tabbar组件
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- popup_show: false, //弹窗是否显示
|
|
|
|
- platform: "", //ios or android
|
|
|
|
- version: "1.0.0", //当前软件版本
|
|
|
|
- need_update: false, // 是否更新
|
|
|
|
- downing: false, //是否下载中
|
|
|
|
- downstatus: 0, //0未下载 1已开始 2已连接到资源 3已接收到数据 4下载完成
|
|
|
|
- update_info: {
|
|
|
|
- os: "", //设备系统
|
|
|
|
- version: "", //最新版本
|
|
|
|
- info: "", //升级说明
|
|
|
|
- },
|
|
|
|
- fileSize: 0, //文件大小
|
|
|
|
- downSize: 0, //已下载大小
|
|
|
|
- viewObj: null, //原生遮罩view
|
|
|
|
- };
|
|
|
|
- },
|
|
|
|
- created() {
|
|
|
|
- vm = this;
|
|
|
|
- if (!this.getVer) this.update()
|
|
|
|
- },
|
|
|
|
- computed: {
|
|
|
|
- // 下载进度计算
|
|
|
|
- lengthWidth: function () {
|
|
|
|
- let w = (this.downSize / this.fileSize) * 100;
|
|
|
|
- if (!w) {
|
|
|
|
- w = 0;
|
|
|
|
- } else {
|
|
|
|
- w = w.toFixed(2);
|
|
|
|
- }
|
|
|
|
- return {
|
|
|
|
- width: w + "%", //return 宽度半分比
|
|
|
|
- };
|
|
|
|
- },
|
|
|
|
- getHeight() {
|
|
|
|
- let bottom = 0;
|
|
|
|
- if (this.tabbar) {
|
|
|
|
- bottom = 50;
|
|
|
|
- }
|
|
|
|
- return {
|
|
|
|
- bottom: bottom + "px",
|
|
|
|
- height: "auto",
|
|
|
|
- };
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- // 检查更新
|
|
|
|
- update() {
|
|
|
|
- // #ifdef APP-PLUS
|
|
|
|
- // 获取手机系统信息
|
|
|
|
- uni.getSystemInfo({
|
|
|
|
- success: function (res) {
|
|
|
|
- vm.platform = res.platform; //ios or android
|
|
|
|
- console.log("手机系统信息", vm.platform);
|
|
|
|
- },
|
|
|
|
- });
|
|
|
|
-
|
|
|
|
- // 获取版本号
|
|
|
|
- plus.runtime.getProperty(plus.runtime.appid, function (inf) {
|
|
|
|
- vm.version = inf.version;
|
|
|
|
- });
|
|
|
|
- console.log("当前版本", vm.version);
|
|
|
|
- this.getUpdateInfo(); //获取更新信息
|
|
|
|
- // #endif
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // 获取线上版本信息
|
|
|
|
- getUpdateInfo() {
|
|
|
|
- //向后台发起请求,获取最新版本号
|
|
|
|
- getUpdateInfo(this.platform === "ios" ? 2 : 1)
|
|
|
|
- .then((res) => {
|
|
|
|
- console.log(res)
|
|
|
|
- if (Array.isArray(res.data)) {
|
|
|
|
- return this.$emit('isNew')
|
|
|
|
- }
|
|
|
|
- const tagDate = uni.getStorageSync('app_update_time') || '',
|
|
|
|
- nowDate = new Date().toLocaleDateString();
|
|
|
|
- if (tagDate !== nowDate && !this.getVer) {
|
|
|
|
- uni.setStorageSync('app_update_time', new Date().toLocaleDateString());
|
|
|
|
- } else if ((tagDate !== nowDate) && this.getVer) {
|
|
|
|
- if (!res.data.is_force) return
|
|
|
|
- } else if (tagDate == nowDate && !this.getVer && !res.data.is_force) {
|
|
|
|
- return
|
|
|
|
- }
|
|
|
|
- // 这里的返回的数据跟后台约定
|
|
|
|
- let data = res.data;
|
|
|
|
- // 循环获取当前设备对应的更新数据
|
|
|
|
- vm.update_info = data;
|
|
|
|
- if (!vm.update_info.platform) {
|
|
|
|
- // 后台未配置当前系统的升级数据
|
|
|
|
- } else {
|
|
|
|
- console.log('111111111111111')
|
|
|
|
- vm.checkUpdate(); ///检查是否更新
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- .catch((err) => {
|
|
|
|
- vm.popup_show = false
|
|
|
|
- console.log(err);
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- // 检查是否更新
|
|
|
|
- checkUpdate() {
|
|
|
|
- vm.need_update = vm.compareVersion(vm.version, vm.update_info.version); // 检查是否需要升级
|
|
|
|
- if (vm.need_update) {
|
|
|
|
- vm.popup_show = true; //线上版本号大于当前安装的版本号 显示升级框
|
|
|
|
- if (vm.tabbar) {
|
|
|
|
- //页面是否有原生tabbar组件
|
|
|
|
- // 创建原生view用来遮罩tabbar的点击事件 (如果是没有用原生的tabbar这一步可以取消)
|
|
|
|
- vm.viewObj = new plus.nativeObj.View("viewObj", {
|
|
|
|
- bottom: "0px",
|
|
|
|
- left: "0px",
|
|
|
|
- height: "50px",
|
|
|
|
- width: "100%",
|
|
|
|
- backgroundColor: "rgba(0,0,0,.6)",
|
|
|
|
- });
|
|
|
|
- vm.viewObj.show(); //显示原生遮罩
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- this.$emit('isNew')
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // 取消更新
|
|
|
|
- closeUpdate() {
|
|
|
|
- if (vm.update_info.is_force) {
|
|
|
|
- // 强制更新,取消退出app
|
|
|
|
- this.platform == "android" ?
|
|
|
|
- plus.runtime.quit() :
|
|
|
|
- plus.ios
|
|
|
|
- .import("UIApplication")
|
|
|
|
- .sharedApplication()
|
|
|
|
- .performSelector("exit");
|
|
|
|
- } else {
|
|
|
|
- vm.popup_show = false; //关闭升级弹窗
|
|
|
|
- if (vm.viewObj) vm.viewObj.hide(); //隐藏原生遮罩
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- // 立即更新
|
|
|
|
- nowUpdate() {
|
|
|
|
- if (vm.downing) return false; //如果正在下载就停止操作
|
|
|
|
- vm.downing = true; //状态改变 正在下载中
|
|
|
|
-
|
|
|
|
- if (/\.apk$/.test(vm.update_info.url)) {
|
|
|
|
- // 如果是apk地址
|
|
|
|
- vm.download_wgt(); // 安装包/升级包更新
|
|
|
|
- } else if (/\.wgt$/.test(vm.update_info.url)) {
|
|
|
|
- // 如果是更新包
|
|
|
|
- vm.download_wgt(); // 安装包/升级包更新
|
|
|
|
- } else {
|
|
|
|
- plus.runtime.openURL(vm.update_info.url, function () {
|
|
|
|
- //调用外部浏览器打开更新地址
|
|
|
|
- plus.nativeUI.toast("打开错误");
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- // 下载升级资源包
|
|
|
|
- download_wgt() {
|
|
|
|
- plus.nativeUI.showWaiting("下载更新文件..."); //下载更新文件...
|
|
|
|
- let options = {
|
|
|
|
- method: "get",
|
|
|
|
- };
|
|
|
|
- let dtask = plus.downloader.createDownload(
|
|
|
|
- vm.update_info.url,
|
|
|
|
- options,
|
|
|
|
- function (d, status) { }
|
|
|
|
- );
|
|
|
|
-
|
|
|
|
- dtask.addEventListener("statechanged", function (task, status) {
|
|
|
|
- if (status === null) { } else if (status == 200) {
|
|
|
|
- //在这里打印会不停的执行,请注意,正式上线切记不要在这里打印东西///////////////////////////////////////////////////
|
|
|
|
- vm.downstatus = task.state;
|
|
|
|
- switch (task.state) {
|
|
|
|
- case 3: // 已接收到数据
|
|
|
|
- vm.downSize = task.downloadedSize;
|
|
|
|
- if (task.totalSize) {
|
|
|
|
- vm.fileSize = task.totalSize; //服务器须返回正确的content-length才会有长度
|
|
|
|
- }
|
|
|
|
- break;
|
|
|
|
- case 4:
|
|
|
|
- vm.installWgt(task.filename); // 安装wgt包
|
|
|
|
- break;
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- plus.nativeUI.closeWaiting();
|
|
|
|
- plus.nativeUI.toast("下载出错");
|
|
|
|
- vm.downing = false;
|
|
|
|
- vm.downstatus = 0;
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
- dtask.start();
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // 安装文件
|
|
|
|
- installWgt(path) {
|
|
|
|
- plus.nativeUI.showWaiting("安装更新文件..."); //安装更新文件...
|
|
|
|
- plus.runtime.install(
|
|
|
|
- path, {},
|
|
|
|
- function () {
|
|
|
|
- plus.nativeUI.closeWaiting();
|
|
|
|
- // 应用资源下载完成!
|
|
|
|
- plus.nativeUI.alert("应用资源下载完成!", function () {
|
|
|
|
- plus.runtime.restart();
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- function (e) {
|
|
|
|
- plus.nativeUI.closeWaiting();
|
|
|
|
- // 安装更新文件失败
|
|
|
|
- plus.nativeUI.alert("安装更新文件失败[" + e.code + "]:" + e.message);
|
|
|
|
- }
|
|
|
|
- );
|
|
|
|
- },
|
|
|
|
- // 对比版本号
|
|
|
|
- compareVersion(ov, nv) {
|
|
|
|
- if (!ov || !nv || ov == "" || nv == "") {
|
|
|
|
- return false;
|
|
|
|
- }
|
|
|
|
- let b = false,
|
|
|
|
- ova = ov.split(".", 4),
|
|
|
|
- nva = nv.split(".", 4);
|
|
|
|
- for (let i = 0; i < ova.length && i < nva.length; i++) {
|
|
|
|
- let so = ova[i],
|
|
|
|
- no = parseInt(so),
|
|
|
|
- sn = nva[i],
|
|
|
|
- nn = parseInt(sn);
|
|
|
|
- if (nn > no || sn.length > so.length) {
|
|
|
|
- return true;
|
|
|
|
- } else if (nn < no) {
|
|
|
|
- return false;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- if (nva.length > ova.length && 0 == nv.indexOf(ov)) {
|
|
|
|
- return true;
|
|
|
|
- } else {
|
|
|
|
- return false;
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
-};
|
|
|
|
-</script>
|
|
|
|
-
|
|
|
|
-<style lang="scss" scoped>
|
|
|
|
-.popup-bg {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- position: fixed;
|
|
|
|
- top: 0;
|
|
|
|
- left: 0rpx;
|
|
|
|
- right: 0;
|
|
|
|
- bottom: 0;
|
|
|
|
- width: 750rpx;
|
|
|
|
- background-color: rgba(0, 0, 0, 0.6);
|
|
|
|
- z-index: 10000;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.popup-content {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- align-items: center;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.popup-content-show {
|
|
|
|
- animation: mymove 500ms;
|
|
|
|
- transform: scale(1);
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-@keyframes mymove {
|
|
|
|
- 0% {
|
|
|
|
- transform: scale(0);
|
|
|
|
- /*开始为原始大小*/
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- 100% {
|
|
|
|
- transform: scale(1);
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.update-wrap {
|
|
|
|
- width: 580rpx;
|
|
|
|
- border-radius: 18rpx;
|
|
|
|
- position: relative;
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- background-color: #ffffff;
|
|
|
|
- padding: 170rpx 30rpx 0;
|
|
|
|
-
|
|
|
|
- .top-img {
|
|
|
|
- position: absolute;
|
|
|
|
- left: 0;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 256rpx;
|
|
|
|
- top: -128rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .content {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- align-items: center;
|
|
|
|
- padding-bottom: 40rpx;
|
|
|
|
-
|
|
|
|
- .title {
|
|
|
|
- font-size: 32rpx;
|
|
|
|
- font-weight: bold;
|
|
|
|
- color: #6526f3;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .title-sub {
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- color: #666666;
|
|
|
|
- padding: 30rpx 0;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .btn {
|
|
|
|
- width: 460rpx;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- color: #ffffff;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- height: 80rpx;
|
|
|
|
- line-height: 80rpx;
|
|
|
|
- border-radius: 100px;
|
|
|
|
- background-color: #6526f3;
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.close-ioc {
|
|
|
|
- width: 70rpx;
|
|
|
|
- height: 70rpx;
|
|
|
|
- margin-top: 30rpx;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.sche-wrap {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: flex-end;
|
|
|
|
- padding: 10rpx 50rpx 0;
|
|
|
|
-
|
|
|
|
- .sche-wrap-text {
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- color: #666;
|
|
|
|
- margin-bottom: 20rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .sche-bg {
|
|
|
|
- position: relative;
|
|
|
|
- background-color: #cccccc;
|
|
|
|
- height: 30rpx;
|
|
|
|
- border-radius: 100px;
|
|
|
|
- width: 480rpx;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
-
|
|
|
|
- .sche-bg-jindu {
|
|
|
|
- position: absolute;
|
|
|
|
- left: 0;
|
|
|
|
- top: 0;
|
|
|
|
- height: 30rpx;
|
|
|
|
- min-width: 40rpx;
|
|
|
|
- border-radius: 100px;
|
|
|
|
- background: url(images/round.png) #5775e7 center right 4rpx no-repeat;
|
|
|
|
- background-size: 26rpx 26rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .down-text {
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- color: #5674e5;
|
|
|
|
- margin-top: 16rpx;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|