From 6a8c84b70a86cc66bf2755beebd613497078d64d Mon Sep 17 00:00:00 2001
From: Iruka <1017819588@qq.com>
Date: Mon, 10 Feb 2025 17:27:31 +0800
Subject: [PATCH] .

---
 App.vue                                       |  45 +++
 api/index.js                                  |   8 +
 .../custom-app-update/custom-app-update.vue   | 276 ++++++++++++++++++
 manifest.json                                 |   4 +-
 pages/index.vue                               |   4 +
 pages/mine/index.vue                          |  17 +-
 pages/mine/setting/index.vue                  |  41 ++-
 7 files changed, 368 insertions(+), 27 deletions(-)
 create mode 100644 components/custom-app-update/custom-app-update.vue

diff --git a/App.vue b/App.vue
index 5635b5f..a45aa72 100644
--- a/App.vue
+++ b/App.vue
@@ -8,6 +8,9 @@
 	} from "@/utils/indexUtil/dc.js"
 	import mqttUtil from "@/utils/mqttUtil.js"
 	const mqttUrl = import.meta.env.VITE_BASE_MQTT;
+	import {
+		getNewAppVersion
+	} from '@/api/index.js'
 
 	export default {
 		data() {
@@ -19,6 +22,10 @@
 				topics: null,
 				mqttFun: {},
 				landFun: {},
+				version: {
+					oldV: null,
+					newV: null,
+				},
 			}
 		},
 		globalData: {},
@@ -54,6 +61,26 @@
 				// this.ijs = new indexUtil(); //全局地块列表管理
 				// this.dc = new deviceControl(2, this.dcEventHandler); // 设备控制类
 				this.mqtt = new mqttUtil(mqttUrl, this.mqttStateHandler, this.mqttMsgHandler); //Mqtt
+
+				// 检测新版本
+				// #ifdef H5
+				this.version.oldV = {
+					versionName: "1.0.0", //网页版
+					versionCode: "1",
+					// versionCode: "9999999999",
+				}
+				// #endif
+				// #ifdef APP-PLUS
+				plus.runtime.getProperty(plus.runtime.appid, widgetInfo => {
+					this.version.oldV = {
+						versionName: widgetInfo.version,
+						versionCode: widgetInfo.versionCode,
+					}
+				})
+				getNewAppVersion().then(res => {
+					this.setUpdateVersion(res.data);
+				})
+				// #endif
 			},
 			// 添加一个消息回调
 			on(type, key, callBack) {
@@ -141,6 +168,7 @@
 						});
 						break;
 					case dcEventType.refreshApi: // 接口刷新阀门
+						console.error("refreshApi:", params);
 						break;
 					case dcEventType.send: // 命令控制设备
 						this.ijs.sendDeviceControl(params);
@@ -200,6 +228,23 @@
 					data: JSON.parse(data),
 				});
 			},
+			setUpdateVersion(data) {
+				if (data) {
+					let isLatestVersion = Number(this.version.oldV.versionCode) >= Number(data.versionCode);
+					if (isLatestVersion) {
+						this.version.newV = null;
+					} else {
+						this.version.newV = {
+							versionName: data.versionName, //版本名称
+							versionCode: data.versionCode, //版本号
+							versionUrl: data.versionUrl, //下载地址
+							isForceUpdate: data.forceUpgrade == 0, //强制升级
+						}
+					}
+				} else {
+					this.version.newV = null;
+				}
+			},
 		}
 	}
 </script>
diff --git a/api/index.js b/api/index.js
index 9956960..d68a755 100644
--- a/api/index.js
+++ b/api/index.js
@@ -23,4 +23,12 @@ export function getDeviceList(data) {
 		method: "get",
 		data: data
 	})
+}
+
+//查询最新版本
+export function getNewAppVersion() {
+	return request({
+		url: "/system/appVersion/getNewAppVersion",
+		method: "get"
+	})
 }
\ No newline at end of file
diff --git a/components/custom-app-update/custom-app-update.vue b/components/custom-app-update/custom-app-update.vue
new file mode 100644
index 0000000..5f70f90
--- /dev/null
+++ b/components/custom-app-update/custom-app-update.vue
@@ -0,0 +1,276 @@
+<template>
+	<u-popup ref="popupRef" :show="showPop" :mask-click-able="false" mode="center" :overlay="true"
+		:closeOnClickOverlay="false" :safeAreaInsetBottom="false">
+		<view class="upgrade-popup">
+			<image class="header-bg" src="../../static/images/chengxushengji.png" mode="widthFix"></image>
+			<view class="main">
+				<view class="version">发现新版本{{ versionName }}</view>
+				<view class="content" v-if="versionDesc">
+					<text class="title">更新内容</text>
+					<view class="desc" v-html="versionDesc"></view>
+				</view>
+				<!--下载状态-进度条显示 -->
+				<view v-show="showPercent" class="progress">
+					<progress :percent="percent.progress" :show-info="true" stroke-width="15" />
+					<view style="font-size: 14px; text-align: center; margin: 14px 0">
+						下载中，请稍后({{ percent.totalBytesWritten }}/{{ percent.totalBytesExpectedToWrite }})</view>
+				</view>
+				<!-- 强制更新 -->
+				<view class="footer" v-if="isForceUpdate">
+					<view class="btn upgrade force" @click="handleUpgrade">立即更新</view>
+				</view>
+				<!-- 可选择更新 -->
+				<view class="footer" v-if="!isForceUpdate">
+					<view class="btn close" @click="handleClose">以后再说</view>
+					<view class="btn upgrade" @click="handleUpgrade">立即更新</view>
+				</view>
+			</view>
+		</view>
+	</u-popup>
+</template>
+<script setup>
+	import store from "@/store"
+	import {
+		ref,
+		reactive,
+		onMounted
+	} from "vue"
+	import {
+		onLaunch,
+		onShow,
+		onLoad
+	} from "@dcloudio/uni-app"
+	import {
+		getNewAppVersion
+	} from '@/api/index.js'
+
+	const showPop = ref(false)
+	const versionName = ref(null) //版本名称
+	const versionDesc = ref(null) //更新说明
+	const downloadUrl = ref(null) //APP下载链接
+	const isForceUpdate = ref(false) //是否强制更新
+	const showPercent = ref(false) //是否显示进度条
+
+
+	const percent = reactive({
+		progress: 0, //下载进度
+		totalBytesWritten: 0, //已经下载的数据长度
+		totalBytesExpectedToWrite: 0 //预期需要下载的数据总长度
+	})
+
+	// 使用 defineExpose 暴露给父组件调用
+	defineExpose({
+		show,
+	});
+
+	function show() {
+		const _version = getApp().version.newV;
+		if (_version) {
+			showPop.value = true;
+			versionName.value = _version.versionName;
+			versionDesc.value = null;
+			downloadUrl.value = _version.versionUrl;
+			isForceUpdate.value = _version.isForceUpdate;
+		} else {
+			showPop.value = false
+		}
+	}
+
+	function hide() {
+		showPop.value = false
+	}
+
+	function handleUpgrade() {
+		if (uni.getSystemInfoSync().platform == "android") {
+			var downloadTask = uni.downloadFile({
+				url: downloadUrl.value,
+				success: downloadResult => {
+					if (downloadResult.statusCode === 200) {
+						console.log("下载成功")
+						plus.runtime.install(
+							downloadResult.tempFilePath, {
+								force: false
+							},
+							function() {
+								console.log("install success")
+								plus.runtime.restart()
+							},
+							function(e) {
+								console.error("install fail")
+							}
+						)
+					}
+				},
+				fail: () => {
+					uni.showToast({
+						title: "默认",
+						icon: "none",
+						duration: "下载失败，请检查网络连接"
+					})
+				}
+			})
+			showPercent.value = true
+			downloadTask.onProgressUpdate(res => {
+				percent.progress = res.progress
+				percent.totalBytesWritten = convertBytesToMb(res.totalBytesWritten) + " Mb"
+				percent.totalBytesExpectedToWrite = convertBytesToMb(res.totalBytesExpectedToWrite) + " Mb"
+			})
+		}
+	}
+
+	//关闭返回
+	function handleClose() {
+		hide()
+	}
+
+	function convertBytesToMb(bytes) {
+		const megabytes = bytes / (1024 * 1024) // 1 MB = 1024 * 1024 bytes
+		const roundedMb = Math.round(megabytes * 10) / 10 // 保留一位小数
+		return roundedMb
+	}
+</script>
+
+<style lang="scss" scoped>
+	.upgrade-popup {
+		width: 580rpx;
+		height: auto;
+		position: fixed;
+		top: 50%;
+		left: 50%;
+		transform: translate(-50%, -50%);
+		background: #fff;
+		border-radius: 20rpx;
+		box-sizing: border-box;
+		border: 1px solid #eee;
+	}
+
+	.header-bg {
+		width: 240rpx;
+		display: block;
+		margin: auto;
+		margin-bottom: 10px;
+		margin-top: -112rpx;
+	}
+
+	.main {
+		padding: 10rpx 30rpx 30rpx;
+		box-sizing: border-box;
+
+		.version {
+			font-size: 36rpx;
+			color: #026df7;
+			font-weight: 700;
+			width: 100%;
+			text-align: center;
+			overflow: hidden;
+			text-overflow: ellipsis;
+			white-space: nowrap;
+			letter-spacing: 1px;
+		}
+
+		.content {
+			margin-top: 60rpx;
+
+			.title {
+				font-size: 28rpx;
+				font-weight: 700;
+				color: #000000;
+			}
+
+			.desc {
+				box-sizing: border-box;
+				margin-top: 20rpx;
+				font-size: 28rpx;
+				color: #6a6a6a;
+				max-height: 80vh;
+				overflow-y: auto;
+			}
+		}
+
+		.progress {
+			width: 100%;
+			flex-shrink: 0;
+			margin: auto;
+			text-align: center;
+			margin-top: 20px;
+		}
+
+		.footer {
+			width: 100%;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			position: relative;
+			flex-shrink: 0;
+			margin-top: 100rpx;
+
+			.btn {
+				width: 246rpx;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				position: relative;
+				z-index: 999;
+				height: 96rpx;
+				box-sizing: border-box;
+				font-size: 32rpx;
+				border-radius: 10rpx;
+				letter-spacing: 2rpx;
+
+				&.force {
+					width: 500rpx;
+				}
+
+				&.close {
+					border: 1px solid #e0e0e0;
+					margin-right: 25rpx;
+					color: #000;
+				}
+
+				&.upgrade {
+					background-color: #026df7;
+					color: white;
+				}
+			}
+
+			.progress-view {
+				width: 510rpx;
+				height: 90rpx;
+				display: flex;
+				position: relative;
+				align-items: center;
+				border-radius: 6rpx;
+				background-color: #dcdcdc;
+				display: flex;
+				justify-content: flex-start;
+				padding: 0px;
+				box-sizing: border-box;
+				border: none;
+				overflow: hidden;
+
+				&.active {
+					background-color: #026df7;
+				}
+
+				.progress {
+					height: 100%;
+					background-color: #026df7;
+					padding: 0px;
+					box-sizing: border-box;
+					border: none;
+					border-top-left-radius: 10rpx;
+					border-bottom-left-radius: 10rpx;
+				}
+
+				.txt {
+					font-size: 28rpx;
+					position: absolute;
+					top: 50%;
+					left: 50%;
+					transform: translate(-50%, -50%);
+					color: #fff;
+				}
+			}
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/manifest.json b/manifest.json
index 8037e81..51b4f19 100644
--- a/manifest.json
+++ b/manifest.json
@@ -2,8 +2,8 @@
     "name" : "及时雨智能灌溉管理系统v1.0",
     "appid" : "__UNI__5ACF7F6",
     "description" : "",
-    "versionName" : "1.0.0",
-    "versionCode" : "100",
+    "versionName" : "1.4.5",
+    "versionCode" : 145,
     "transformPx" : false,
     /* 5+App特有相关 */
     "app-plus" : {
diff --git a/pages/index.vue b/pages/index.vue
index ae227f6..25884fa 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -546,6 +546,7 @@
 	<!-- 墒情 -->
 	<custom-index-mp ref="mpRef" />
 
+	<custom-app-update ref="appUpdate" />
 </template>
 
 <script>
@@ -601,6 +602,9 @@
 				} else {}
 			});
 		},
+		mounted() {
+			// this.$refs.appUpdate.show();
+		},
 		onShow() {
 			this.title = this.ijs?.land?.landName || "田间";
 			// 监听控制角度弹窗通知
diff --git a/pages/mine/index.vue b/pages/mine/index.vue
index f3ebd5b..7f14953 100644
--- a/pages/mine/index.vue
+++ b/pages/mine/index.vue
@@ -117,18 +117,16 @@
 			</view>
 		</view>
 		<view style="position: absolute;bottom: 5px;width: 100vw;text-align: center;color: darkgray;">
-			版本 {{version}}
+			版本 {{version.versionName}}
 		</view>
 	</view>
+	<custom-app-update ref="appUpdate" />
 </template>
 
 <script setup>
 	import {
 		ref
 	} from "vue";
-	import {
-		onShow,
-	} from "@dcloudio/uni-app"
 	import store from '@/store'
 	import storage from '@/utils/storage'
 	import config from '@/config.js'
@@ -138,15 +136,8 @@
 	const popup = ref(null);
 	const rolses = store.state.user.roles;
 	// const version = config.appInfo.version;
-	const version = ref("h5");
-
-	onShow(() => {
-		// #ifdef APP-PLUS
-		plus.runtime.getProperty(plus.runtime.appid, widgetInfo => {
-			version.value = widgetInfo.version;
-		})
-		// #endif
-	})
+	const version = getApp().version.oldV;
+	const appUpdate = ref(null)
 
 	uni.$on('refresh', () => {
 		avatar.value = store.state.user.avatar;
diff --git a/pages/mine/setting/index.vue b/pages/mine/setting/index.vue
index dffe18e..78571a0 100644
--- a/pages/mine/setting/index.vue
+++ b/pages/mine/setting/index.vue
@@ -10,24 +10,33 @@
 					<view>修改密码</view>
 				</view>
 			</view>
-			<view class="list-cell list-cell-arrow" @click="handleToUpgrade">
-				<view class="menu-item-box">
-					<view class="iconfont icon-refresh menu-icon"></view>
-					<view>检查更新</view>
-				</view>
-			</view>
 			<view class="list-cell list-cell-arrow" @click="handleCleanTmp">
 				<view class="menu-item-box">
 					<view class="iconfont icon-clean menu-icon"></view>
 					<view>清理缓存</view>
 				</view>
 			</view>
+			<view class="list-cell list-cell-arrow" @click="handleToUpgrade">
+				<view class="menu-item-box">
+					<view class="iconfont icon-refresh menu-icon"></view>
+					<view>检查更新</view>
+					<view style="position: absolute;color: darkgray;right: 30px;" v-if="version.newV">
+						发现新版本
+					</view>
+					<view style="position: absolute;color: darkgray;right: 30px;" v-else>
+						{{version.oldV.versionName}}
+					</view>
+				</view>
+			</view>
 		</view>
 		<view class="cu-list menu">
 			<view class="item-box">
 				<u-button class="bg-red" type="success" size="large" text="退出登录" @click="handleLogout" />
 			</view>
 		</view>
+		<view style="position: absolute;bottom: 5px;width: 100vw;text-align: center;color: darkgray;">
+			版本 {{version.oldV.versionName}}
+		</view>
 	</view>
 	<view>
 		<uni-popup ref="popup" type="dialog">
@@ -36,6 +45,8 @@
 			</uni-popup-dialog>
 		</uni-popup>
 	</view>
+
+	<custom-app-update ref="appUpdate" />
 </template>
 
 <script setup>
@@ -43,9 +54,14 @@
 		ref
 	} from "vue";
 	import store from '@/store'
+	import {
+		getNewAppVersion
+	} from '@/api/index.js'
 
 	const windowHeight = ref(uni.getSystemInfoSync().windowHeight);
+	const version = ref(getApp().version);
 	const popup = ref(null);
+	const appUpdate = ref(null)
 
 	function handleToPwd() {
 		uni.navigateTo({
@@ -54,12 +70,13 @@
 	};
 
 	function handleToUpgrade() {
-		uni.showToast({
-			title: '模块建设中~',
-			mask: false,
-			icon: "none",
-			duration: 1000
-		});
+		getNewAppVersion().then(res => {
+			getApp().setUpdateVersion(res.data);
+			version.value = getApp().version;
+			if (version.value) {
+				appUpdate.value.show();
+			}
+		})
 	};
 
 	function handleCleanTmp() {