feat: add onmyoji-flow migration prompt

This commit is contained in:
2026-05-18 15:31:03 +08:00
parent 8e3f8c2283
commit c55371adfe
2 changed files with 75 additions and 2 deletions
+60
View File
@@ -9,6 +9,9 @@ import {TabPaneName, TabsPaneContext} from "element-plus";
import YysRank from "@/components/YysRank.vue"; import YysRank from "@/components/YysRank.vue";
const filesStore = useFilesStore(); const filesStore = useFilesStore();
const NEW_PROJECT_URL = 'https://fireschain.org/onmyoji-flow/';
const REDIRECT_PROMPT_SESSION_KEY = 'yys-editor.new-project-redirect-prompted';
const REDIRECT_PROMPT_DISABLED_KEY = 'yys-editor.new-project-redirect-disabled';
const yysRef = ref(null); const yysRef = ref(null);
const width = ref('100%'); const width = ref('100%');
@@ -16,6 +19,37 @@ const height = ref('100vh');
const toolbarHeight = 48; // 工具栏的高度 const toolbarHeight = 48; // 工具栏的高度
const windowHeight = ref(window.innerHeight); const windowHeight = ref(window.innerHeight);
const contentHeight = computed(() => `${windowHeight.value - toolbarHeight}px`); const contentHeight = computed(() => `${windowHeight.value - toolbarHeight}px`);
const showRedirectPrompt = ref(false);
const dontShowRedirectPromptAgain = ref(false);
const rememberRedirectPromptChoice = () => {
if (dontShowRedirectPromptAgain.value) {
window.localStorage.setItem(REDIRECT_PROMPT_DISABLED_KEY, 'true');
}
};
const showNewProjectRedirectPrompt = () => {
if (window.localStorage.getItem(REDIRECT_PROMPT_DISABLED_KEY) === 'true') {
return;
}
if (window.sessionStorage.getItem(REDIRECT_PROMPT_SESSION_KEY) === 'true') {
return;
}
window.sessionStorage.setItem(REDIRECT_PROMPT_SESSION_KEY, 'true');
showRedirectPrompt.value = true;
};
const goToNewProject = () => {
rememberRedirectPromptChoice();
window.location.assign(NEW_PROJECT_URL);
};
const stayOnLegacyProject = () => {
rememberRedirectPromptChoice();
showRedirectPrompt.value = false;
};
const onResizing = (x, y, width, height) => { const onResizing = (x, y, width, height) => {
width.value = width; width.value = width;
@@ -64,6 +98,7 @@ onMounted(() => {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
windowHeight.value = window.innerHeight; windowHeight.value = window.innerHeight;
}); });
showNewProjectRedirectPrompt();
}); });
onUnmounted(() => { onUnmounted(() => {
@@ -112,6 +147,26 @@ const activeFileGroups = computed(() => {
</el-tabs> </el-tabs>
</div> </div>
</div> </div>
<el-dialog
v-model="showRedirectPrompt"
title="前往新版 onmyoji-flow"
width="420px"
:close-on-click-modal="false"
@close="rememberRedirectPromptChoice"
>
<p class="redirect-prompt-text">
yys-editor 已迁移到新项目 onmyoji-flow新版会继续维护资源与功能是否现在前往
</p>
<el-checkbox v-model="dontShowRedirectPromptAgain">
以后不再提示
</el-checkbox>
<template #footer>
<span class="dialog-footer">
<el-button @click="stayOnLegacyProject">继续使用旧版</el-button>
<el-button type="primary" @click="goToNewProject">前往新版</el-button>
</span>
</template>
</el-dialog>
</div> </div>
</template> </template>
@@ -157,4 +212,9 @@ const activeFileGroups = computed(() => {
max-width: 100%; max-width: 100%;
} }
.redirect-prompt-text {
margin: 0 0 16px;
line-height: 1.7;
color: #303133;
}
</style> </style>
+13
View File
@@ -1,6 +1,9 @@
<template> <template>
<div class="toolbar"> <div class="toolbar">
<div> <div>
<el-button class="new-project-link" type="success" icon="Promotion" @click="goToNewProject">
前往新版
</el-button>
<el-button icon="Upload" type="primary" @click="handleImport">{{ t('import') }}</el-button> <el-button icon="Upload" type="primary" @click="handleImport">{{ t('import') }}</el-button>
<el-button icon="Download" type="primary" @click="handleExport">{{ t('export') }}</el-button> <el-button icon="Download" type="primary" @click="handleExport">{{ t('export') }}</el-button>
<el-button icon="Share" type="primary" @click="prepareCapture">{{ t('prepareCapture') }}</el-button> <el-button icon="Share" type="primary" @click="prepareCapture">{{ t('prepareCapture') }}</el-button>
@@ -87,10 +90,15 @@ import {useGlobalMessage} from "@/ts/useGlobalMessage";
const filesStore = useFilesStore(); const filesStore = useFilesStore();
const { showMessage } = useGlobalMessage(); const { showMessage } = useGlobalMessage();
const NEW_PROJECT_URL = 'https://fireschain.org/onmyoji-flow/';
// 获取当前的 i18n 实例 // 获取当前的 i18n 实例
const {t} = useI18n(); const {t} = useI18n();
const goToNewProject = () => {
window.location.assign(NEW_PROJECT_URL);
};
// 定义响应式数据 // 定义响应式数据
const state = reactive({ const state = reactive({
previewImage: null, // 用于存储预览图像的数据URL previewImage: null, // 用于存储预览图像的数据URL
@@ -393,6 +401,11 @@ const handleClose = (done) => {
z-index: 100; z-index: 100;
} }
.new-project-link {
font-weight: 700;
box-shadow: 0 0 0 2px rgba(82, 196, 26, 0.18);
}
.title { .title {
flex-grow: 1; flex-grow: 1;
text-align: center; text-align: center;