|
@@ -1,51 +1,40 @@
|
|
|
-import { computed, defineComponent, onMounted, ref, onUnmounted } from 'vue';
|
|
|
+import { computed, defineComponent, onMounted, onUnmounted } from 'vue';
|
|
|
import { NConfigProvider, zhCN, dateZhCN, NModal } from 'naive-ui';
|
|
|
import { AppProvider } from './components/Application';
|
|
|
-import { RouterView, useRouter } from 'vue-router';
|
|
|
+import { RouterView } from 'vue-router';
|
|
|
import setting from './settings/designSetting';
|
|
|
import { lighten } from './utils';
|
|
|
import RouterError from './components/RouterError';
|
|
|
import { useRegisterSW } from 'virtual:pwa-register/vue';
|
|
|
import { useUserStore } from './store/modules/users';
|
|
|
-export function unregister() {
|
|
|
- if ('serviceWorker' in navigator) {
|
|
|
- // console.log('unregister - pwa');
|
|
|
- // navigator.serviceWorker.ready.then(registration => {
|
|
|
- // registration.unregister();
|
|
|
- // });
|
|
|
- // navigator.serviceWorker
|
|
|
- // .getRegistrations()
|
|
|
- // .then(registrations => {
|
|
|
- // for (const registration of registrations) {
|
|
|
- // registration.unregister().then(boolean => {
|
|
|
- // if (boolean) {
|
|
|
- // console.log('Service Worker unregistered successfully');
|
|
|
- // } else {
|
|
|
- // console.log('Service Worker unregistration failed');
|
|
|
- // }
|
|
|
- // });
|
|
|
- // }
|
|
|
- // })
|
|
|
- // .catch(error => {
|
|
|
- // console.error('Error getting Service Worker registrations:', error);
|
|
|
- // });
|
|
|
- } else {
|
|
|
- console.log('Service Workers are not supported in this browser');
|
|
|
- }
|
|
|
-}
|
|
|
+import UpdateTips from './update-tips';
|
|
|
|
|
|
export default defineComponent({
|
|
|
name: 'App',
|
|
|
setup() {
|
|
|
- const isIOSChrome = ref();
|
|
|
+ const upload = true;
|
|
|
+ const { needRefresh, offlineReady, updateServiceWorker } = useRegisterSW({
|
|
|
+ onRegistered(r: any) {
|
|
|
+ console.log(r, 'registered');
|
|
|
+
|
|
|
+ // r &&
|
|
|
+ // setInterval(() => {
|
|
|
+ // r.update();
|
|
|
+ // }, 30000);
|
|
|
+ },
|
|
|
+ onNeedRefresh() {
|
|
|
+ console.log('新版本可用!');
|
|
|
+ },
|
|
|
+ onOfflineReady() {
|
|
|
+ console.log('离线功能就绪。');
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // const isIOSChrome = ref();
|
|
|
+ // const showModalMask = ref(false);
|
|
|
const getThemeOverrides = computed(() => {
|
|
|
const appTheme = setting.appTheme;
|
|
|
const lightenStr = lighten(setting.appTheme, 6);
|
|
|
-
|
|
|
- // errorColor: string;
|
|
|
- // errorColorHover: string;
|
|
|
- // errorColorPressed: string;
|
|
|
- // errorColorSuppl: string;
|
|
|
return {
|
|
|
common: {
|
|
|
primaryColor: appTheme,
|
|
@@ -61,109 +50,103 @@ export default defineComponent({
|
|
|
};
|
|
|
});
|
|
|
// const showModal = ref(false);
|
|
|
- const showModalMsg = ref('');
|
|
|
- // 判断浏览器
|
|
|
- // 是否是360
|
|
|
- const check360 = () => {
|
|
|
- const result = false;
|
|
|
- for (const key in navigator.plugins) {
|
|
|
- // np-mswmp.dll只在360浏览器下存在
|
|
|
- if (navigator.plugins[key].filename == 'internal-nacl-plugin') {
|
|
|
- return !result;
|
|
|
- }
|
|
|
- }
|
|
|
- return result;
|
|
|
- };
|
|
|
+ // const showModalMsg = ref('');
|
|
|
+ // // 判断浏览器
|
|
|
+ // // 是否是360
|
|
|
+ // const check360 = () => {
|
|
|
+ // const result = false;
|
|
|
+ // for (const key in navigator.plugins) {
|
|
|
+ // // np-mswmp.dll只在360浏览器下存在
|
|
|
+ // if (navigator.plugins[key].filename == 'internal-nacl-plugin') {
|
|
|
+ // return !result;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // return result;
|
|
|
+ // };
|
|
|
//
|
|
|
|
|
|
- const isChrome = () => {
|
|
|
- const isChromium = window.chrome,
|
|
|
- winNav = window.navigator,
|
|
|
- vendorName = winNav.vendor,
|
|
|
- isOpera = winNav.userAgent.indexOf('OPR') > -1,
|
|
|
- isIEedge = winNav.userAgent.indexOf('Edge') > -1,
|
|
|
- isIOSChrome = winNav.userAgent.match('CriOS'),
|
|
|
- // QQ
|
|
|
- isQQBriwser =
|
|
|
- winNav.userAgent.indexOf('QQBrowser') > -1 ||
|
|
|
- winNav.userAgent.indexOf('QQ') > -1,
|
|
|
- // 搜狗
|
|
|
- isSouggou =
|
|
|
- winNav.userAgent.indexOf('se 2.x') > -1 ||
|
|
|
- winNav.userAgent.indexOf('MetaSr') > -1,
|
|
|
- // 360
|
|
|
- is360 = check360() && winNav.userAgent.indexOf('Safari') > -1,
|
|
|
- // 遨游
|
|
|
- isMaxthon = winNav.userAgent.indexOf('Maxthon') > -1,
|
|
|
- // 是否为2345浏览器
|
|
|
- is2345Explorer = winNav.userAgent.includes('2345Explorer'),
|
|
|
- // 世界之窗
|
|
|
- isTheWorld = winNav.userAgent.indexOf('TheWorld') > -1,
|
|
|
- // 猎豹
|
|
|
- isLiebao = winNav.userAgent.indexOf('LBBROWSER') > -1;
|
|
|
- // console.log(isQQBriwser, isSouggou, is360, isMaxthon, is2345Explorer, isTheWorld, isLiebao)
|
|
|
- if (isIOSChrome) {
|
|
|
- return true;
|
|
|
- } else if (
|
|
|
- isChromium !== null &&
|
|
|
- typeof isChromium !== 'undefined' &&
|
|
|
- vendorName === 'Google Inc.' &&
|
|
|
- isOpera === false &&
|
|
|
- isIEedge === false &&
|
|
|
- isQQBriwser === false &&
|
|
|
- isSouggou === false &&
|
|
|
- is360 === false &&
|
|
|
- isMaxthon === false &&
|
|
|
- is2345Explorer === false &&
|
|
|
- isTheWorld === false &&
|
|
|
- isLiebao === false
|
|
|
- ) {
|
|
|
- return true;
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- };
|
|
|
+ // const isChrome = () => {
|
|
|
+ // const isChromium = (window as any).chrome,
|
|
|
+ // winNav = window.navigator,
|
|
|
+ // vendorName = winNav.vendor,
|
|
|
+ // isOpera = winNav.userAgent.indexOf('OPR') > -1,
|
|
|
+ // isIEedge = winNav.userAgent.indexOf('Edge') > -1,
|
|
|
+ // isIOSChrome = winNav.userAgent.match('CriOS'),
|
|
|
+ // // QQ
|
|
|
+ // isQQBriwser =
|
|
|
+ // winNav.userAgent.indexOf('QQBrowser') > -1 ||
|
|
|
+ // winNav.userAgent.indexOf('QQ') > -1,
|
|
|
+ // // 搜狗
|
|
|
+ // isSouggou =
|
|
|
+ // winNav.userAgent.indexOf('se 2.x') > -1 ||
|
|
|
+ // winNav.userAgent.indexOf('MetaSr') > -1,
|
|
|
+ // // 360
|
|
|
+ // is360 = check360() && winNav.userAgent.indexOf('Safari') > -1,
|
|
|
+ // // 遨游
|
|
|
+ // isMaxthon = winNav.userAgent.indexOf('Maxthon') > -1,
|
|
|
+ // // 是否为2345浏览器
|
|
|
+ // is2345Explorer = winNav.userAgent.includes('2345Explorer'),
|
|
|
+ // // 世界之窗
|
|
|
+ // isTheWorld = winNav.userAgent.indexOf('TheWorld') > -1,
|
|
|
+ // // 猎豹
|
|
|
+ // isLiebao = winNav.userAgent.indexOf('LBBROWSER') > -1;
|
|
|
+ // // console.log(isQQBriwser, isSouggou, is360, isMaxthon, is2345Explorer, isTheWorld, isLiebao)
|
|
|
+ // if (isIOSChrome) {
|
|
|
+ // return true;
|
|
|
+ // } else if (
|
|
|
+ // isChromium !== null &&
|
|
|
+ // typeof isChromium !== 'undefined' &&
|
|
|
+ // vendorName === 'Google Inc.' &&
|
|
|
+ // isOpera === false &&
|
|
|
+ // isIEedge === false &&
|
|
|
+ // isQQBriwser === false &&
|
|
|
+ // isSouggou === false &&
|
|
|
+ // is360 === false &&
|
|
|
+ // isMaxthon === false &&
|
|
|
+ // is2345Explorer === false &&
|
|
|
+ // isTheWorld === false &&
|
|
|
+ // isLiebao === false
|
|
|
+ // ) {
|
|
|
+ // return true;
|
|
|
+ // } else {
|
|
|
+ // return false;
|
|
|
+ // }
|
|
|
+ // };
|
|
|
|
|
|
- // 获取谷歌版本
|
|
|
- const getChromeVersion = () => {
|
|
|
- const arr = navigator.userAgent.split(' ');
|
|
|
- let chromeVersion = '' as any;
|
|
|
- for (let i = 0; i < arr.length; i++) {
|
|
|
- if (/chrome/i.test(arr[i])) chromeVersion = arr[i];
|
|
|
- }
|
|
|
- if (chromeVersion) {
|
|
|
- return Number(chromeVersion.split('/')[1].split('.')[0]);
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- };
|
|
|
+ // // 获取谷歌版本
|
|
|
+ // const getChromeVersion = () => {
|
|
|
+ // const arr = navigator.userAgent.split(' ');
|
|
|
+ // let chromeVersion = '' as any;
|
|
|
+ // for (let i = 0; i < arr.length; i++) {
|
|
|
+ // if (/chrome/i.test(arr[i])) chromeVersion = arr[i];
|
|
|
+ // }
|
|
|
+ // if (chromeVersion) {
|
|
|
+ // return Number(chromeVersion.split('/')[1].split('.')[0]);
|
|
|
+ // } else {
|
|
|
+ // return false;
|
|
|
+ // }
|
|
|
+ // };
|
|
|
|
|
|
- const isChromeFlag = isChrome();
|
|
|
- // console.log('isChromeFlag', isChromeFlag);
|
|
|
- if (isChromeFlag) {
|
|
|
- const chromeVersion = getChromeVersion();
|
|
|
- if (!chromeVersion || (chromeVersion && chromeVersion < 100)) {
|
|
|
- showModalMsg.value =
|
|
|
- '您当前的chrome版本过低,为了保证您的用户体验请升级后使用';
|
|
|
- // showModal.value = true;
|
|
|
- }
|
|
|
- // if (chromeVersion) {
|
|
|
- // return Number(chromeVersion.split('/')[1].split('.')[0]);
|
|
|
- // } else {
|
|
|
- // return false;
|
|
|
- // }
|
|
|
- } else {
|
|
|
- showModalMsg.value = '为了保证您的用户体验,请使用chrome打开,点击确定下载';
|
|
|
- // showModal.value = true;
|
|
|
- console.log('---');
|
|
|
- }
|
|
|
- const submitCallback = () => {
|
|
|
- window.open('https://www.google.cn/intl/zh-CN/chrome/');
|
|
|
- };
|
|
|
+ // const isChromeFlag = isChrome();
|
|
|
+ // // console.log('isChromeFlag', isChromeFlag);
|
|
|
+ // if (isChromeFlag) {
|
|
|
+ // const chromeVersion = getChromeVersion();
|
|
|
+ // if (!chromeVersion || (chromeVersion && chromeVersion < 100)) {
|
|
|
+ // showModalMsg.value =
|
|
|
+ // '您当前的chrome版本过低,为了保证您的用户体验请升级后使用';
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // showModalMsg.value = '为了保证您的用户体验,请使用chrome打开,点击确定下载';
|
|
|
+ // // showModal.value = true;
|
|
|
+ // console.log('---');
|
|
|
+ // }
|
|
|
+ // const submitCallback = () => {
|
|
|
+ // window.open('https://www.google.cn/intl/zh-CN/chrome/');
|
|
|
+ // };
|
|
|
const handleOpen = (e: MessageEvent) => {
|
|
|
if (e.data?.api === 'onLogin') {
|
|
|
const userStore = useUserStore();
|
|
|
- const router = useRouter();
|
|
|
+ // const router = useRouter();
|
|
|
const documentDom: any = document;
|
|
|
documentDom.exitFullscreen
|
|
|
? documentDom.exitFullscreen()
|
|
@@ -177,8 +160,21 @@ export default defineComponent({
|
|
|
}
|
|
|
};
|
|
|
|
|
|
+ // const resize = () => {
|
|
|
+ // const params = {
|
|
|
+ // width: document.body.clientWidth,
|
|
|
+ // height: document.body.clientHeight
|
|
|
+ // };
|
|
|
+ // if (params.height >= params.width) {
|
|
|
+ // showModalMask.value = true;
|
|
|
+ // } else {
|
|
|
+ // showModalMask.value = false;
|
|
|
+ // }
|
|
|
+ // };
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
window.addEventListener('message', handleOpen);
|
|
|
+ // window.addEventListener('resize', resize);
|
|
|
|
|
|
// 禁用右键菜单
|
|
|
document.addEventListener('contextmenu', function (event) {
|
|
@@ -196,20 +192,6 @@ export default defineComponent({
|
|
|
}
|
|
|
});
|
|
|
|
|
|
- // const intervalMS = 60 * 60 * 1000;
|
|
|
-
|
|
|
- // console.log(useRegisterSW, '1');
|
|
|
- const updateServiceWorker = useRegisterSW({
|
|
|
- onRegistered(r: any) {
|
|
|
- console.log(r, 'registered');
|
|
|
-
|
|
|
- r &&
|
|
|
- setInterval(() => {
|
|
|
- // console.log('registered interval:', r);
|
|
|
- r.update();
|
|
|
- }, 30000);
|
|
|
- }
|
|
|
- });
|
|
|
// console.log('app - onounted - test interval');
|
|
|
|
|
|
// if ('serviceWorker' in navigator) {
|
|
@@ -227,13 +209,12 @@ export default defineComponent({
|
|
|
// }
|
|
|
});
|
|
|
onUnmounted(() => {
|
|
|
+ // window.removeEventListener('resize', resize);
|
|
|
window.removeEventListener('message', handleOpen);
|
|
|
});
|
|
|
|
|
|
- // 卸载 pwa
|
|
|
- unregister();
|
|
|
return () => (
|
|
|
- <>
|
|
|
+ <div>
|
|
|
<NConfigProvider
|
|
|
locale={zhCN}
|
|
|
themeOverrides={getThemeOverrides.value}
|
|
@@ -245,6 +226,16 @@ export default defineComponent({
|
|
|
<RouterError />
|
|
|
</AppProvider>
|
|
|
</NConfigProvider>
|
|
|
+ <NModal maskClosable={false} v-model:show={needRefresh.value}>
|
|
|
+ <UpdateTips onConfirm={() => updateServiceWorker(true)} />
|
|
|
+ </NModal>
|
|
|
+
|
|
|
+ <span style={{ display: 'none' }}>
|
|
|
+ {needRefresh.value ? '新内容可用,点击刷新页面' : '没有新内容'}
|
|
|
+ </span>
|
|
|
+ <span style={{ display: 'none' }}>
|
|
|
+ {offlineReady.value ? '应用已离线可用' : '没有离线'}
|
|
|
+ </span>
|
|
|
{/* <NModal
|
|
|
show={showModal.value}
|
|
|
closeOnEsc={false}
|
|
@@ -255,7 +246,7 @@ export default defineComponent({
|
|
|
content={showModalMsg.value}
|
|
|
positive-text="确认"
|
|
|
onPositiveClick={submitCallback}></NModal> */}
|
|
|
- </>
|
|
|
+ </div>
|
|
|
);
|
|
|
}
|
|
|
});
|