lilishop-uniapp/plugins/APPUpdate/index.js

// #ifdef APP-PLUS 
/**** 此文件说明请看注释 *****/
// 可以用自己项目的请求方法
// 请求配置说明：https://ext.dcloud.net.cn/plugin?id=822
import http from '@/utils/request.js';
/**** 结束 *****/
import {
	getAppVersionList
} from '@/api/message.js'

const platform = uni.getSystemInfoSync().platform;
// 主颜色
const $mainColor = "#1ABC9C";
// 弹窗图标url
const $iconUrl = "https://lilishop-oss.oss-cn-beijing.aliyuncs.com/app/upgrade.png";

// 获取当前应用的版本号
export const getCurrentNo = function (callback) {
	// 获取本地应用资源版本号
	plus.runtime.getProperty(plus.runtime.appid, function (inf) {
	
		callback && callback({
			versionCode: inf.version.replace(/\./g, ""),
			version: inf.version
		});
	});
}
// 发起ajax请求获取服务端版本号
export const getServerNo = function (callback) {
	let type;
	
	platform == "android" ? type = "ANDROID" : type = "IOS"

	getAppVersionList(type).then(res => {
	
		if(res.data.success && res.data.result.downloadUrl){
			let response = res.data.result
			let result ={}
			result.versionCode = response.version;
			result.versionName = response.versionName;
			result.versionInfo = response.content || '暂无';
			result.forceUpdate = response.forceUpdate;
			result.downloadUrl = response.downloadUrl;
		
			console.log(result,response)
			callback && callback(result);
		}
	})
	
}
// 从服务器下载应用资源包（wgt文件）
export const getDownload = function (data) {
	let popupData = {
		progress: true,
		buttonNum: 2
	};
	if (data.forceUpdate) {
		popupData.buttonNum = 0;
		popupData.forceUpdate = data.forceUpdate;
	}
	let dtask;
	let lastProgressValue = 0;
	downloadPopup(popupData, function (res) {
		dtask = plus.downloader.createDownload(data.downloadUrl, {
			filename: "_doc/update/"
		}, function (download, status) {
			if (status == 200) {
				res.change({
					progressValue: 100,
					progressTip: "正在安装文件...",
					progress: true,
					buttonNum: 0
				});
				plus.runtime.install(download.filename, {}, function () {
					res.change({
						contentText: "应用资源更新完成！",
						buttonNum: 1,
						progress: false
					});
				}, function (e) {
					res.cancel();
					plus.nativeUI.alert("安装文件失败[" + e.code + "]：" + e.message);
				});
			} else {
				res.change({
					contentText: "文件下载失败...",
					buttonNum: 1,
					progress: false
				});
			}
		});
		dtask.start();
		dtask.addEventListener("statechanged", function (task, status) {
			switch (task.state) {
				case 1: // 开始
					res.change({
						progressValue: 0,
						progressTip: "准备下载...",
						progress: true
					});
					break;
				case 2: // 已连接到服务器  
					res.change({
						progressValue: 0,
						progressTip: "开始下载...",
						progress: true
					});
					break;
				case 3:
					const progress = parseInt(task.downloadedSize / task.totalSize * 100);
					if (progress - lastProgressValue >= 2) {
						lastProgressValue = progress;
						res.change({
							progressValue: progress,
							progressTip: "已下载" + progress + "%",
							progress: true
						});
					}
					break;
			}
		});
	}, function () {
		// 取消下载
		dtask && dtask.abort();
		uni.showToast({
			title: "已取消下载",
			icon: "none"
		});
	},
		function () {
			// 重启APP
			plus.runtime.restart();
		});
}
// 文字换行
function drawtext(text, maxWidth) {
	let textArr = text.split("");
	let len = textArr.length;

	// 上个节点
	let previousNode = 0;
	// 记录节点宽度
	let nodeWidth = 0;
	// 文本换行数组
	let rowText = [];

	

	// 如果是字母，侧保存长度
	let letterWidth = 0;
	// 汉字宽度
	let chineseWidth = 14;
	// otherFont宽度
	let otherWidth = 7;
	for (let i = 0; i < len; i++) {
		if (/[\u4e00-\u9fa5]|[\uFE30-\uFFA0]/g.test(textArr[i])) {
			if (letterWidth > 0) {
				if (nodeWidth + chineseWidth + letterWidth * otherWidth > maxWidth) {
					rowText.push({
						type: "text",
						content: text.substring(previousNode, i)
					});
					previousNode = i;
					nodeWidth = chineseWidth;
					letterWidth = 0;
				} else {
					nodeWidth += chineseWidth + letterWidth * otherWidth;
					letterWidth = 0;
				}
			} else {
				if (nodeWidth + chineseWidth > maxWidth) {
					rowText.push({
						type: "text",
						content: text.substring(previousNode, i)
					});
					previousNode = i;
					nodeWidth = chineseWidth;
				} else {
					nodeWidth += chineseWidth;
				}
			}
		} else {
			if (/\n/g.test(textArr[i])) {
				rowText.push({
					type: "break",
					content: text.substring(previousNode, i)
				});
				previousNode = i + 1;
				nodeWidth = 0;
				letterWidth = 0;
			} else if (textArr[i] == "\\" && textArr[i + 1] == "n") {
				rowText.push({
					type: "break",
					content: text.substring(previousNode, i)
				});
				previousNode = i + 2;
				nodeWidth = 0;
				letterWidth = 0;
			} else if (/[a-zA-Z0-9]/g.test(textArr[i])) {
				letterWidth += 1;
				if (nodeWidth + letterWidth * otherWidth > maxWidth) {
					rowText.push({
						type: "text",
						content: text.substring(previousNode, i + 1 - letterWidth)
					});
					previousNode = i + 1 - letterWidth;
					nodeWidth = letterWidth * otherWidth;
					letterWidth = 0;
				}
			} else {
				if (nodeWidth + otherWidth > maxWidth) {
					rowText.push({
						type: "text",
						content: text.substring(previousNode, i)
					});
					previousNode = i;
					nodeWidth = otherWidth;
				} else {
					nodeWidth += otherWidth;
				}
			}
		}
	}
	if (previousNode < len) {
		rowText.push({
			type: "text",
			content: text.substring(previousNode, len)
		});
	}

	return rowText;
}
// 是否更新弹窗
function updatePopup(data, callback) {
	// 弹窗遮罩层
	let maskLayer = new plus.nativeObj.View("maskLayer", { //先创建遮罩层
		top: '0px',
		left: '0px',
		height: '100%',
		width: '100%',
		backgroundColor: 'rgba(0,0,0,0.5)'
	});
	let downloadUrl = data.downloadUrl;
	// 以下为计算菜单的nview绘制布局，为固定算法，使用者无关关心
	const screenWidth = plus.screen.resolutionWidth;
	const screenHeight = plus.screen.resolutionHeight;
	//弹窗容器宽度
	const popupViewWidth = screenWidth * 0.8;
	// 弹窗容器的Padding
	const viewContentPadding = 20;
	// 弹窗容器的宽度
	const viewContentWidth = parseInt(popupViewWidth - (viewContentPadding * 5));
	// 描述的列表
	const descriptionList = drawtext(data.versionInfo, viewContentWidth);
	
	// 弹窗容器高度
	let popupViewHeight = 400;
	let popupViewContentList = [{
		src: $iconUrl,
		id: "logo",
		tag: "img"
	},
	{
		tag: 'font',
		id: 'title',
		text: 'V' + data.versionCode,
		textStyles: {
			size: '26px',
			color: "#fff",
			weight: "700"
		},
		position: {
			top: '60px',
			left: "64px",
			height: "20px",
		}
	},
	{
		tag: 'font',
		id: 'welcome',
		text: '欢迎体验',
		textStyles: {
			size: '16px',
			color: "#fff",
			weight: "400"
		},
		position: {
			top: '85px',
			left: "64px",
			height: "20px",
		}
	}
	];
	const textHeight = 18;
	let contentTop = popupViewHeight / 2 + 8;
	popupViewContentList.push({
		tag: 'font',
		id: 'content-title',
		text: '新版本特性：',
		textStyles: {
			size: '20px',
			lineSpacing: "50%",
			align: "left"
		},
		position: {
			top: (popupViewHeight / 2) - 24 + "px",
			left: viewContentPadding + "px",
			width: viewContentWidth + "px",
			height: textHeight + "px",
		}
	});
	descriptionList.forEach((item, index) => {
		if (index > 0) {
			popupViewHeight += textHeight;
			contentTop += textHeight;
		}
		let content = item.content.replace('<p>', '<font>');
		content = content.replace('</p>', '</font>');

		popupViewContentList.push({
			tag: 'richtext',
			id: 'content' + index + 1,
			text: content,
			richTextStyles: {
				align: "left"
			},
			position: {
				top: contentTop + "px",
				left: viewContentPadding + "px",
				width: viewContentWidth + "px",
				height: textHeight + "px",
			}
		});
		if (item.type == "break") {
			contentTop += 10;
			popupViewHeight += 10;
		}
	});
	// 弹窗内容
	let popupView = new plus.nativeObj.View("popupView", { //创建底部图标菜单
		tag: "rect",
		top: (screenHeight - popupViewHeight) / 2 + "px",
		left: '10%',
		height: popupViewHeight + "px",
		width: "80%"
	});
	// 绘制白色背景
	popupView.drawRect({
		color: "#FFFFFF",
		radius: "8px"
	}, {
		top: "40px",
		height: popupViewHeight - 40 + "px",
	});
	// 绘制底边按钮
	popupView.drawRect({
		radius: "3px",
		borderColor: "#f1f1f1",
		borderWidth: "1px",
	}, {
		bottom: viewContentPadding + 'px',
		left: viewContentPadding + "px",
		width: (viewContentWidth - viewContentPadding) / 2 + "px",
		height: "30px",
	});
	// 绘制底边按钮
	popupView.drawRect({
		radius: "3px",
		color: $mainColor,
		borderColor: $mainColor
	}, {
		bottom: viewContentPadding + 'px',
		left: ((viewContentWidth - viewContentPadding) / 2 + viewContentPadding * 2) + "px",
		width: (viewContentWidth - viewContentPadding) / 2 + "px",
		height: "30px"
	});
	popupViewContentList.push({
		tag: 'rect',
		id: 'confimBtn',
		rectStyles: {
			color: $mainColor,
			radius: "3px"
		},
		position: {
			bottom: viewContentPadding + 'px',
			left: (viewContentWidth - viewContentPadding) / 3 + "px",
			width: (viewContentWidth - viewContentPadding) + "px",
			height: "40px",
		}
	});
	popupViewContentList.push({
		tag: 'font',
		id: 'confirmText',
		text: "立即更新",
		textStyles: {
			size: '18px',
			color: '#fff',
			lineSpacing: "0%",
			whiteSpace: "normal"
		},
		position: {
			bottom: viewContentPadding + 'px',
			left: (viewContentWidth - viewContentPadding) / 3 + "px",
			width: (viewContentWidth - viewContentPadding) + "px",
			height: "40px",
		}
	});
	popupView.draw(popupViewContentList);
	popupView.addEventListener("click", function (e) {
		let maxTop = popupViewHeight - viewContentPadding;
		let maxLeft = popupViewWidth - viewContentPadding;
		let buttonWidth = (viewContentWidth - viewContentPadding) / 2;
		if (e.clientY > maxTop - 30 && e.clientY < maxTop) {
			// 暂不升级
			if (e.clientX > viewContentPadding && e.clientX < maxLeft - buttonWidth - viewContentPadding) {
				// 立即升级
				if (platform == "android") {
					maskLayer.hide();
					popupView.hide();
					callback && callback();
				} else {
					if (!data.forceUpdate) {
						maskLayer.hide();
						popupView.hide();
					}
					plus.runtime.openURL(downloadUrl);
				}
			} else if (e.clientX > maxLeft - buttonWidth && e.clientX < maxLeft) {
				// 立即升级
				if (platform == "android") {
					maskLayer.hide();
					popupView.hide();
					callback && callback();
				} else {
					if (!data.forceUpdate) {
						maskLayer.hide();
						popupView.hide();
					}
					plus.runtime.openURL(downloadUrl);
				}

			}
		}
	});
	// 点击遮罩层
	maskLayer.addEventListener("click", function () { //处理遮罩层点击
		if (!data.forceUpdate) {
			maskLayer.hide();
			popupView.hide();
		}
	});
	// 显示弹窗
	maskLayer.show();
	popupView.show();
}
// 文件下载的弹窗绘图
function downloadPopupDrawing(data) {
	// 以下为计算菜单的nview绘制布局，为固定算法，使用者无关关心
	const screenWidth = plus.screen.resolutionWidth;
	const screenHeight = plus.screen.resolutionHeight;
	//弹窗容器宽度
	const popupViewWidth = screenWidth * 0.7;
	// 弹窗容器的Padding
	const viewContentPadding = 20;
	// 弹窗容器的宽度
	const viewContentWidth = popupViewWidth - (viewContentPadding * 2);
	// 弹窗容器高度
	let popupViewHeight = viewContentPadding * 3 + 60;
	let progressTip = data.progressTip || "准备下载...";
	let contentText = data.contentText || "正在为您更新，请耐心等待";
	let elementList = [{
		tag: 'rect', //背景色
		color: '#FFFFFF',
		rectStyles: {
			radius: "8px"
		}
	},
	{
		tag: 'font',
		id: 'title',
		text: "升级APP",
		textStyles: {
			size: '16px',
			color: "#333",
			weight: "bold",
			verticalAlign: "middle",
			whiteSpace: "normal"
		},
		position: {
			top: viewContentPadding + 'px',
			height: "30px",
		}
	},
	{
		tag: 'font',
		id: 'content',
		text: contentText,
		textStyles: {
			size: '14px',
			color: "#333",
			verticalAlign: "middle",
			whiteSpace: "normal"
		},
		position: {
			top: viewContentPadding * 2 + 30 + 'px',
			height: "20px",
		}
	}
	];
	// 是否有进度条
	if (data.progress) {
		popupViewHeight += viewContentPadding + 40;
		elementList = elementList.concat([{
			tag: 'font',
			id: 'progressValue',
			text: progressTip,
			textStyles: {
				size: '14px',
				color: $mainColor,
				whiteSpace: "normal"
			},
			position: {
				top: viewContentPadding * 4 + 20 + 'px',
				height: "30px"
			}
		},
		{
			tag: 'rect', //绘制进度条背景
			id: 'progressBg',
			rectStyles: {
				radius: "4px",
				borderColor: "#f1f1f1",
				borderWidth: "1px",
			},
			position: {
				top: viewContentPadding * 4 + 60 + 'px',
				left: viewContentPadding + "px",
				width: viewContentWidth + "px",
				height: "8px"
			}
		},
		]);
	}
	if (data.buttonNum == 2) {
		popupViewHeight += viewContentPadding + 30;
		// elementList = elementList.concat([{
		// 	tag: 'rect', //绘制底边按钮
		// 	rectStyles: {
		// 		radius: "3px",
		// 		borderColor: "#f1f1f1",
		// 		borderWidth: "1px",
		// 	},
		// 	position: {
		// 		bottom: viewContentPadding + 'px',
		// 		left: viewContentPadding + "px",
		// 		width: (viewContentWidth - viewContentPadding) / 2 + "px",
		// 		height: "30px"
		// 	}
		// },
		// {
		// 	tag: 'rect', //绘制底边按钮
		// 	rectStyles: {
		// 		radius: "3px",
		// 		color: $mainColor
		// 	},
		// 	position: {
		// 		bottom: viewContentPadding + 'px',
		// 		left: ((viewContentWidth - viewContentPadding) / 2 + viewContentPadding * 2) + "px",
		// 		width: (viewContentWidth - viewContentPadding) / 2 + "px",
		// 		height: "30px"
		// 	}
		// },
		// {
		// 	tag: 'font',
		// 	id: 'cancelText',
		// 	text: "取消下载",
		// 	textStyles: {
		// 		size: '14px',
		// 		color: "#666",
		// 		lineSpacing: "0%",
		// 		whiteSpace: "normal"
		// 	},
		// 	position: {
		// 		bottom: viewContentPadding + 'px',
		// 		left: viewContentPadding + "px",
		// 		width: (viewContentWidth - viewContentPadding) / 2 + "px",
		// 		height: "30px",
		// 	}
		// },
		// {
		// 	tag: 'font',
		// 	id: 'confirmText',
		// 	text: "后台下载",
		// 	textStyles: {
		// 		size: '14px',
		// 		color: "#FFF",
		// 		lineSpacing: "0%",
		// 		whiteSpace: "normal"
		// 	},
		// 	position: {
		// 		bottom: viewContentPadding + 'px',
		// 		left: ((viewContentWidth - viewContentPadding) / 2 + viewContentPadding * 2) + "px",
		// 		width: (viewContentWidth - viewContentPadding) / 2 + "px",
		// 		height: "30px",
		// 	}
		// }
		// ]);
		
	}
	if (data.buttonNum == 1) {
		popupViewHeight += viewContentPadding + 40;
		elementList = elementList.concat([{
			tag: 'rect', //绘制底边按钮
			rectStyles: {
				radius: "6px",
				color: $mainColor
			},
			position: {
				bottom: viewContentPadding + 'px',
				left: viewContentPadding + "px",
				width: viewContentWidth + "px",
				height: "40px"
			}
		},
		{
			tag: 'font',
			id: 'confirmText',
			text: "关闭",
			textStyles: {
				size: '14px',
				color: "#FFF",
				lineSpacing: "0%",
			},
			position: {
				bottom: viewContentPadding + 'px',
				left: viewContentPadding + "px",
				width: viewContentWidth + "px",
				height: "40px"
			}
		}
		]);
	}
	return {
		popupViewHeight: popupViewHeight,
		popupViewWidth: popupViewWidth,
		screenHeight: screenHeight,
		viewContentWidth: viewContentWidth,
		viewContentPadding: viewContentPadding,
		elementList: elementList
	};
}
// 文件下载的弹窗
function downloadPopup(data, callback, cancelCallback, rebootCallback) {
	// 弹窗遮罩层
	let maskLayer = new plus.nativeObj.View("maskLayer", { //先创建遮罩层
		top: '0px',
		left: '0px',
		height: '100%',
		width: '100%',
		backgroundColor: 'rgba(0,0,0,0.5)'
	});
	let popupViewData = downloadPopupDrawing(data);
	// 弹窗内容
	let popupView = new plus.nativeObj.View("popupView", { //创建底部图标菜单
		tag: "rect",
		top: (popupViewData.screenHeight - popupViewData.popupViewHeight) / 2 + "px",
		left: '15%',
		height: popupViewData.popupViewHeight + "px",
		width: "70%",
	});
	let progressValue = 0;
	let progressTip = 0;
	let contentText = 0;
	let buttonNum = 2;
	let forceUpdate = data.forceUpdate;
	if (data.buttonNum >= 0) {
		buttonNum = data.buttonNum;
	}
	popupView.draw(popupViewData.elementList);
	popupView.addEventListener("click", function (e) {
		let maxTop = popupViewData.popupViewHeight - popupViewData.viewContentPadding;
		let maxLeft = popupViewData.popupViewWidth - popupViewData.viewContentPadding;
		if (e.clientY > maxTop - 40 && e.clientY < maxTop) {
			if (buttonNum == 1) {
				// 单按钮
				if (e.clientX > popupViewData.viewContentPadding && e.clientX < maxLeft) {
					maskLayer.hide();
					popupView.hide();
				}
			} else if (buttonNum == 2) {
				// 双按钮
				let buttonWidth = (popupViewData.viewContentWidth - popupViewData.viewContentPadding) / 2;
				if (e.clientX > popupViewData.viewContentPadding && e.clientX < maxLeft - buttonWidth - popupViewData.viewContentPadding) {
					maskLayer.hide();
					popupView.hide();
					//cancelCallback && cancelCallback();
				} else if (e.clientX > maxLeft - buttonWidth && e.clientX < maxLeft) {
					maskLayer.hide();
					popupView.hide();
					
				}
			}
		}
	});
	// 显示弹窗
	maskLayer.show();
	popupView.show();
	// 改变进度条
	callback({
		change: function (res) {
			let progressElement = [];
			if (res.progressValue) {
				progressValue = res.progressValue;
				// 绘制进度条
				progressElement.push({
					tag: 'rect', //绘制进度条背景
					id: 'progressValueBg',
					rectStyles: {
						radius: "4px",
						color: $mainColor
					},
					position: {
						top: popupViewData.viewContentPadding * 4 + 60 + 'px',
						left: popupViewData.viewContentPadding + "px",
						width: popupViewData.viewContentWidth * (res.progressValue / 100) + "px",
						height: "8px"
					}
				});
			}
			if (res.progressTip) {
				progressTip = res.progressTip;
				progressElement.push({
					tag: 'font',
					id: 'progressValue',
					text: res.progressTip,
					textStyles: {
						size: '14px',
						color: $mainColor,
						whiteSpace: "normal"
					},
					position: {
						top: popupViewData.viewContentPadding * 4 + 20 + 'px',
						height: "30px"
					}
				});
			}
			if (res.contentText) {
				contentText = res.contentText;
				progressElement.push({
					tag: 'font',
					id: 'content',
					text: res.contentText,
					textStyles: {
						size: '16px',
						color: "#333",
						whiteSpace: "normal"
					},
					position: {
						top: popupViewData.viewContentPadding * 2 + 30 + 'px',
						height: "30px",
					}
				});
			}
			if (res.buttonNum >= 0 && buttonNum != res.buttonNum) {
				buttonNum = res.buttonNum;
				popupView.reset();
				popupViewData = downloadPopupDrawing(Object.assign({
					progressValue: progressValue,
					progressTip: progressTip,
					contentText: contentText,
				}, res));
				let newElement = [];
				popupViewData.elementList.map((item, index) => {
					let have = false;
					progressElement.forEach((childItem, childIndex) => {
						if (item.id == childItem.id) {
							have = true;
						}
					});
					if (!have) {
						newElement.push(item);
					}
				});
				progressElement = newElement.concat(progressElement);
				popupView.setStyle({
					tag: "rect",
					top: (popupViewData.screenHeight - popupViewData.popupViewHeight) / 2 + "px",
					left: '15%',
					height: popupViewData.popupViewHeight + "px",
					width: "70%",
				});
				popupView.draw(progressElement);
			} else {
				popupView.draw(progressElement);
			}
		},
		cancel: function () {
			maskLayer.hide();
			popupView.hide();
		}
	});
}
export default function (isPrompt = false) {
	getCurrentNo(version => {
		getServerNo( res => {
		
			if(	res.version.replace(/\./g, "") > version.versionCode){return false}

			if (res.forceUpdate) {
				if (/\.wgt$/i.test(res.downloadUrl)) {
					getDownload(res);
				} else if (/\.html$/i.test(res.downloadUrl)) {
					plus.runtime.openURL(res.downloadUrl);
				} else {
					if (platform == "android") {
						getDownload(res);
					} else {
						updatePopup(res, function () {
							plus.runtime.openURL(res.downloadUrl);
						})
						// uni.showLoading({
						// 	title: "升级中......",
						// 	mask: true
						// });
						// plus.runtime.openURL(res.downloadUrl);
						// plus.runtime.restart();
					}
				}
			} else {
				updatePopup(res, function () {
					if (/\.wgt$/i.test(res.downloadUrl)) {
						getDownload(res);
					} else if (/\.html$/i.test(res.downloadUrl)) {
						plus.runtime.openURL(res.downloadUrl);
					} else {
						getDownload(res);
						// if (platform == "android") {
						// 	getDownload(res);
						// } else {
						// 	plus.runtime.openURL(res.downloadUrl);
						// }
					}
				});
			}
		});
	});
}
// #endif