hookehuyr

feat: 添加版本更新检查功能

添加版本更新检查工具类Updater,用于定期检查前端版本更新
在App.vue中集成版本检查功能,检测到更新时提示用户刷新页面
移除不再使用的VanDatetimePicker组件声明
<!--
* @Date: 2025-03-20 19:53:12
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-05-08 09:50:42
* @LastEditTime: 2025-10-15 10:02:51
* @FilePath: /mlaj/src/App.vue
* @Description: 入口文件
-->
......@@ -20,6 +20,8 @@ import { wxJsAPI } from "@/api/wx/config";
import { apiList } from "@/api/wx/jsApiList.js";
import { wxInfo } from "@/utils/tools";
import { Updater } from '@/utils/versionUpdater';
import 'vant/es/toast/style'
provideAuth(); // 提供全局认证状态
......@@ -47,6 +49,33 @@ const initWxConfig = async () => {
if (!import.meta.env.DEV && wxInfo().isWeiXin) {
initWxConfig()
}
// TAG:检查是否更新
let upDater = null;
if (import.meta.env.PROD) {
upDater = new Updater({
time: 30000
})
upDater.on('no-update', () => {
// console.log('还没更新')
})
upDater.on('update', () => {
showConfirmDialog({
title: '温馨提示',
message: '检测到新版本,是否刷新页面!',
confirmButtonColor: styleColor.baseColor
}).then(() => {
window.location.reload();
});
})
}
// 组件卸载时清理定时器
onUnmounted(() => {
if (upDater) {
upDater.destroy();
}
});
</script>
<template>
......
......@@ -44,7 +44,6 @@ declare module 'vue' {
VanCol: typeof import('vant/es')['Col']
VanConfigProvider: typeof import('vant/es')['ConfigProvider']
VanDatePicker: typeof import('vant/es')['DatePicker']
VanDatetimePicker: typeof import('vant/es')['DatetimePicker']
VanDialog: typeof import('vant/es')['Dialog']
VanDivider: typeof import('vant/es')['Divider']
VanDropdownItem: typeof import('vant/es')['DropdownItem']
......
/*
* @Date: 2024-02-06 11:38:13
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-30 22:33:40
* @FilePath: /data-table/src/utils/versionUpdater.js
* @Description:
*/
/* eslint-disable */
/**
* @description: 版本更新检查
* @param {*} time 阈值
* @return {*}
*/
export class Updater {
constructor(options = {}) {
this.oldScript = [];
this.newScript = [];
this.dispatch = {};
this.init(); //初始化
this.timing(options.time); //轮询
}
async init() {
const html = await this.getHtml();
this.oldScript = this.parserScript(html);
}
async getHtml() {
// TAG: html的位置需要动态修改
const html = await fetch(import.meta.env.VITE_BASE).then((res) => res.text()); //读取index html
return html;
}
parserScript(html) {
const reg = new RegExp(/<script(?:\s+[^>]*)?>(.*?)<\/script\s*>/gi); //script正则
return html.match(reg); //匹配script标签
}
//发布订阅通知
on(key, fn) {
(this.dispatch[key] || (this.dispatch[key] = [])).push(fn);
return this;
}
compare(oldArr, newArr) {
const base = oldArr.length;
// 去重
const arr = Array.from(new Set(oldArr.concat(newArr)));
//如果新旧length 一样无更新
if (arr.length === base) {
this.dispatch['no-update'].forEach((fn) => {
fn();
});
} else {
//否则通知更新
this.dispatch['update'].forEach((fn) => {
fn();
});
}
}
timing(time = 10000) {
//轮询
this.intervalId = setInterval(async () => {
const newHtml = await this.getHtml();
this.newScript = this.parserScript(newHtml);
this.compare(this.oldScript, this.newScript);
}, time);
}
/**
* 清理定时器
*/
destroy() {
if (this.intervalId) {
clearInterval(this.intervalId);
this.intervalId = null;
}
}
}