Files
ndm-web-client/src/composables/query/system/use-version-check-query.ts

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;
},
});
}
});
}