yicangzongtai_app_240321/pages/protocol/versionUpgrade.vue

<template>
	<view>
		<navbar :config="config" backColor="#666"></navbar>
		<view class="main">
			<view class="imgBox">
				<image src="/static/logo-icon.png" mode="widthFix"></image>
				<text>版本 {{appInfo.ver}}</text>
			</view>
			<view class="title">更新描述：</view>
			<view class="txt">{{appInfo.info}}</view>
		</view>
		<view class="btnBox">
			<view v-if="startProgress" class="smallTitle">
				<view>下载进度:{{ downloadProgress }}%</view>
				<u-line-progress active-color="#3775F6" :show-percent="false" :percent="downloadProgress">
				</u-line-progress>
			</view>
			<view class="btn" v-else @click="handleUpdate()">立即更新</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				config: {
					back: true,
					title: '版本升级',
					color: '#1a1a1a',
					backgroundColor: [1, "#fff"],
					statusBarFontColor: 'black',
				},
				appInfo: {},
				startProgress: false, // 下载进行 - 标记
				downloadProgress: 0
			}
		},
		onLoad() {
			this.getAppInfo()
		},
		methods: {
			// 获取更新信息
			getAppInfo() {
				this.$http.get('/app/config/info').then(res => {
					if (res && res.code == 200) {
						this.appInfo = res.data
					}
				})
			},
			// 开始下载任务
			createTask(downloadLink) {
				console.log("下载链接" + downloadLink)
				this.downloadProgress = 0;
				this.startProgress = true;
				// 创建下载任务对象
				this.downloadTask = uni.downloadFile({
					url: downloadLink,
					success: res => {

						if (res.statusCode === 200) {
							// 保存下载的安装包
							uni.saveFile({
								tempFilePath: res.tempFilePath,
								success: res => {
									this.packgePath = res.savedFilePath;
									// 进行安装
									this.installPackge();
									// 任务完成，关闭下载任务
									this.closeTask();
								}
							});
						}
					}
				});

				this.downloadTask.onProgressUpdate(res => {
					this.downloadProgress = res.progress;
					this.$forceUpdate()
					console.log(res.progress)
				});
			},
			// 关闭下载任务
			closeTask() {
				this.downloadTask.abort();
				this.downloadTask = null;
				this.startProgress = false;
			},
			installPackge() {
				// 安装更新
				plus.runtime.install(this.packgePath, {
					force: true
				});
				this.installed = true;
				// 保存更新记录到stroage，方便下次启动app时删除安装包
				uni.setStorage({
					key: 'updated',
					data: {
						completed: true,
						packgePath: this.packgePath
					},
					success: res => {

						console.log('成功保存更新记录');
						// console.log(res.data)
					}
				});
				// 判断是否为热更新（判断文件名中是否含有.wgt）
				console.log(8888888888888888888888 + this.packgePath);
				if (this.packgePath.match(RegExp(/.wgt/))) {
					console.log("9999999999999")
					this.installed = false;
					uni.showModal({
						title: '提示',
						content: '应用将重启以完成更新',
						showCancel: false,
						complete: () => {
							plus.runtime.restart();
						}
					});
				}
			},
			// 取得最新版本及其所有信息
			// async getLatest() {
			// 	console.log("gengxinyemian")
			// 	this.info = '正在加载'; // 主标题显示版本号
			// 	this.Minfo = '未知'; // 副标题显示版本类型
			// 	this.updateInfo = '无'; // 更新摘要
			// 	this.buttonLoading = true;
			// 	this.verInfo = null;
			// 	let res = await this.$http.get('/app/config/info');

			// 	if (res.code == 200) {
			// 		this.buttonLoading = false;
			// 		console.log("gengxinxixi"+JSON.stringify(res.data))
			// 		this.info = res.data.name;
			// 		this.Minfo = res.data.ver;

			// 		this.updateInfo = res.data.info;
			// 		this.packgeSize = res.data.packge_size + 'MB';
			// 		this.verInfo = res.data;

			// 		if (this.verInfo) {
			// 			this.checkLatest(this.verInfo);
			// 		}
			// 	}
			// },
			handleUpdate() {
				// 判断系统类型
				if (plus.os.name.toLowerCase() === 'android') {
					if (this.appInfo.android_link && this.appInfo.android_link !== '#') {

						this.createTask(this.appInfo.android_link);
					} else {
						this.showToast('未找到下载地址');
					}
				} else {
					if (this.appInfo.ios_link && this.appInfo.ios_link !== '#') {
						// 我这里默认#也是没有地址，请根据业务自行修改
						// 苹果(A)：进行热更新（如果iosUrl是wgt更新包的下载地址）判断文件名中是否含有.wgt
						if (this.appInfo.ios_link.match(RegExp(/.wgt/))) {
							this.createTask(this.appInfo.ios_link);
						} else {
							// 苹果(B)：打开商店链接（如果iosUrl是苹果商店的地址）
							plus.runtime.openURL(this.appInfo.ios_link);
						}
					} else {
						this.showToast('未找到ios商店地址');
					}
				}
			}
		}
	}
</script>

<style lang="scss">
	.main {
		padding-top: 170rpx;
		padding: 170rpx 100rpx 0;

		.imgBox {
			text-align: center;
			font-size: 28rpx;
			color: #666666;

			image {
				display: block;
				width: 75rpx;
				height: 75rpx;
				margin: 10rpx auto;
			}
		}

		.title {
			font-size: 30rpx;
			color: #1A1A1A;
			margin-bottom: 10rpx;
			margin: 52rpx 0 10rpx;
		}

		.txt {
			color: #808080;
			font-size: 26rpx;
		}
	}

	.btnBox {
		width: 100%;
		position: fixed;
		bottom: 100rpx;

		.smallTitle {
			padding: 0 50rpx;
			text-align: center;
		}

		.btn {
			width: 540rpx;
			height: 80rpx;
			font-size: 32rpx;
			color: #FFFFFF;
			background: #FA6138;
			border-radius: 40rpx;
			text-align: center;
			line-height: 80rpx;
			margin: auto;
		}
	}
</style>