mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-01-23 01:30:26 +08:00
feat: 初步集成PageSpy,设置内增加上传离线日志按钮
This commit is contained in:
parent
87e5b0522e
commit
b8182b6c30
@ -14,7 +14,7 @@ import type { SegmentedItem } from '@vben-core/shadcn-ui';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { Copy, RotateCw } from '@vben/icons';
|
||||
import { CloudUpload, Copy, RotateCw } from '@vben/icons';
|
||||
import { $t, loadLocaleMessages } from '@vben/locales';
|
||||
import {
|
||||
clearPreferencesCache,
|
||||
@ -30,7 +30,7 @@ import {
|
||||
} from '@vben-core/shadcn-ui';
|
||||
import { globalShareState } from '@vben-core/shared/global-state';
|
||||
|
||||
import { useClipboard } from '@vueuse/core';
|
||||
import { useClipboard, useThrottleFn } from '@vueuse/core';
|
||||
|
||||
import {
|
||||
Animation,
|
||||
@ -217,6 +217,18 @@ async function handleReset() {
|
||||
resetPreferences();
|
||||
await loadLocaleMessages(preferences.app.locale);
|
||||
}
|
||||
const harbor = computed(() => window.$harbor);
|
||||
// 防抖
|
||||
const handleUploadLog = useThrottleFn(() => {
|
||||
if (!harbor.value) {
|
||||
return;
|
||||
}
|
||||
harbor.value.onOfflineLog('upload');
|
||||
message.copyPreferencesSuccess?.(
|
||||
$t('preferences.logUploadSuccessTitle'),
|
||||
$t('preferences.logUploadSuccess'),
|
||||
);
|
||||
}, 5000);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -228,6 +240,13 @@ async function handleReset() {
|
||||
>
|
||||
<template #extra>
|
||||
<div class="flex items-center">
|
||||
<VbenIconButton
|
||||
:disabled="!harbor"
|
||||
:tooltip="$t('preferences.logUpload')"
|
||||
class="relative"
|
||||
>
|
||||
<CloudUpload class="size-4" @click="handleUploadLog" />
|
||||
</VbenIconButton>
|
||||
<VbenIconButton
|
||||
:disabled="!diffPreference"
|
||||
:tooltip="$t('preferences.resetTip')"
|
||||
|
@ -28,6 +28,9 @@
|
||||
"copyPreferencesSuccessTitle": "Copy successful",
|
||||
"copyPreferencesSuccess": "Copy successful, please override in `src/preferences.ts` under app",
|
||||
"clearAndLogout": "Clear Cache & Logout",
|
||||
"logUpload": "Upload Log",
|
||||
"logUploadSuccess": "Log Upload Successful",
|
||||
"logUploadSuccessTitle": "Upload Successful",
|
||||
"mode": "Mode",
|
||||
"general": "General",
|
||||
"language": "Language",
|
||||
|
@ -28,6 +28,9 @@
|
||||
"copyPreferencesSuccessTitle": "复制成功",
|
||||
"copyPreferencesSuccess": "复制成功,请在 app 下的 `src/preferences.ts`内进行覆盖",
|
||||
"clearAndLogout": "清空缓存 & 退出登录",
|
||||
"logUpload": "上传日志",
|
||||
"logUploadSuccess": "离线日志上传成功",
|
||||
"logUploadSuccessTitle": "上传成功",
|
||||
"mode": "模式",
|
||||
"general": "通用",
|
||||
"language": "语言",
|
||||
|
@ -27,6 +27,35 @@
|
||||
})();
|
||||
}
|
||||
</script>
|
||||
<!-- 可以使用自己的部署的PageSpy的sdk 修改引入的地址即可 -->
|
||||
<!-- https://pagespy.mufei88.com 为vben测试sdk地址 -->
|
||||
<script
|
||||
crossorigin="anonymous"
|
||||
src="https://pagespy.mufei88.com/page-spy/index.min.js"
|
||||
></script>
|
||||
<script
|
||||
crossorigin="anonymous"
|
||||
src="https://pagespy.mufei88.com/plugin/data-harbor/index.min.js"
|
||||
></script>
|
||||
<script
|
||||
crossorigin="anonymous"
|
||||
src="https://pagespy.mufei88.com/plugin/rrweb/index.min.js"
|
||||
></script>
|
||||
<script>
|
||||
window.$harbor = new DataHarborPlugin();
|
||||
window.$rrweb = new RRWebPlugin();
|
||||
|
||||
[window.$harbor, window.$rrweb].forEach((p) => {
|
||||
PageSpy.registerPlugin(p);
|
||||
});
|
||||
// 实例化的参数都是可选的
|
||||
window.$pageSpy = new PageSpy({
|
||||
project: '<%= VITE_APP_TITLE %>',
|
||||
autoRender: false,
|
||||
title: 'Vben Admin',
|
||||
});
|
||||
// 之后即可使用 PageSpy,前往 https://pagespy.mufei88.com 体验
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
Loading…
Reference in New Issue
Block a user