60 lines
2.1 KiB
TypeScript
60 lines
2.1 KiB
TypeScript
import type { VersionInfo } from '@/apis/domains/version-info';
|
|
import { useQuery } from '@tanstack/vue-query';
|
|
import axios from 'axios';
|
|
import { useThemeVars } from 'naive-ui';
|
|
import { h, ref, watch } from 'vue';
|
|
|
|
export function useVersionCheckQuery() {
|
|
const localVersionInfo = ref<VersionInfo>();
|
|
const dialogShow = ref<boolean>(false);
|
|
const themeVars = useThemeVars();
|
|
|
|
const { data: remoteVersionInfo, dataUpdatedAt } = useQuery({
|
|
queryKey: ['version-check'],
|
|
queryFn: async () => {
|
|
const { data } = await axios.get<VersionInfo>(`/manifest.json?t=${Date.now()}`);
|
|
return data;
|
|
},
|
|
refetchInterval: 10 * 1000,
|
|
});
|
|
|
|
watch(dataUpdatedAt, () => {
|
|
const newVersionInfo = remoteVersionInfo.value;
|
|
if (!newVersionInfo) return;
|
|
|
|
if (!localVersionInfo.value) {
|
|
localVersionInfo.value = newVersionInfo;
|
|
return;
|
|
}
|
|
|
|
const { version: localVersion, buildTime: localBuildTime } = localVersionInfo.value;
|
|
const { version: remoteVersion, buildTime: remoteBuildTime } = newVersionInfo;
|
|
|
|
if ((localVersion !== remoteVersion || localBuildTime !== remoteBuildTime) && !dialogShow.value) {
|
|
dialogShow.value = true;
|
|
window.$dialog.info({
|
|
title: '发现新版本',
|
|
content: () =>
|
|
h('div', {}, [
|
|
h('div', {}, { default: () => `当前版本:${localVersionInfo.value?.version}` }),
|
|
h('div', {}, { default: () => `最新版本:${newVersionInfo.version}` }),
|
|
h('div', {}, { default: () => '请点击刷新页面以更新' }),
|
|
h('div', { style: { marginTop: '8px', fontWeight: '700', color: themeVars.value.warningColor } }, { default: () => '⚠️ 注意,更新后可能需要重新登录!' }),
|
|
]),
|
|
positiveText: '刷新页面',
|
|
maskClosable: false,
|
|
onPositiveClick: () => {
|
|
window.location.reload();
|
|
},
|
|
negativeText: '稍后检查',
|
|
onNegativeClick: () => {
|
|
dialogShow.value = false;
|
|
},
|
|
onClose: () => {
|
|
dialogShow.value = false;
|
|
},
|
|
});
|
|
}
|
|
});
|
|
}
|