From c20347d95ead8c7f3b6324680fa5ba1c4c6f18b2 Mon Sep 17 00:00:00 2001
From: zzs <hi@vio.vin>
Date: Fri, 21 Mar 2025 11:51:27 +0800
Subject: [PATCH] wip: init iframe settings

---
 src/logics/initAppConfig.ts            |   6 +
 src/router/guard/permissionGuard.ts    |   4 +
 src/settings/projectSetting.ts         |   8 +-
 src/utils/iframe.ts                    |  10 ++
 src/views/infra/bookmark/event.data.ts |  25 ++++
 src/views/infra/bookmark/index.vue     | 169 +------------------------
 6 files changed, 56 insertions(+), 166 deletions(-)
 create mode 100644 src/utils/iframe.ts
 create mode 100644 src/views/infra/bookmark/event.data.ts

diff --git a/src/logics/initAppConfig.ts b/src/logics/initAppConfig.ts
index 563d6ae..fce0fe3 100644
--- a/src/logics/initAppConfig.ts
+++ b/src/logics/initAppConfig.ts
@@ -21,6 +21,7 @@ import { getCommonStoragePrefix, getStorageShortName } from '@/utils/env'
 import { Persistent } from '@/utils/cache/persistent'
 import { deepMerge } from '@/utils'
 import { ThemeEnum } from '@/enums/appEnum'
+import { isInIframe } from '@/utils/iframe'
 
 // Initial project configuration
 export function initAppConfigStore() {
@@ -47,6 +48,11 @@ export function initAppConfigStore() {
   catch (error) {
     console.log(error)
   }
+
+  // 如果当前界面被当作iframe使用，设置页面全屏显示
+  console.warn(`${isInIframe()}__isInIframe`)
+  projCfg.fullContent = isInIframe()
+
   appStore.setProjectConfig(projCfg)
 
   // init dark mode
diff --git a/src/router/guard/permissionGuard.ts b/src/router/guard/permissionGuard.ts
index 97016b3..dbc794c 100644
--- a/src/router/guard/permissionGuard.ts
+++ b/src/router/guard/permissionGuard.ts
@@ -31,6 +31,10 @@ export function createPermissionGuard(router: Router) {
     //   return
     // }
 
+    const routerToken = to.query.token || to.query.access_token || undefined
+    if (routerToken)
+      userStore.setAccessToken(routerToken as string)
+
     const token = userStore.getAccessToken
 
     // Whitelist can be directly entered
diff --git a/src/settings/projectSetting.ts b/src/settings/projectSetting.ts
index 52d3c30..6454922 100644
--- a/src/settings/projectSetting.ts
+++ b/src/settings/projectSetting.ts
@@ -44,7 +44,7 @@ const setting: ProjectConfig = {
   // 色弱模式
   colorWeak: false,
   // 是否取消菜单,顶部,多标签页显示, 用于可能内嵌在别的系统内
-  fullContent: false,
+  fullContent: true,
   // 主题内容宽度
   contentMode: ContentEnum.FULL,
   // 是否显示logo
@@ -116,7 +116,7 @@ const setting: ProjectConfig = {
   // 多标签
   multiTabsSetting: {
     // 刷新后是否保留已经打开的标签页
-    cache: false,
+    cache: true,
     // 开启
     show: true,
     // 显示图标
@@ -155,8 +155,8 @@ const setting: ProjectConfig = {
   // 是否使用全局错误捕获
   useErrorHandle: false,
   // 是否开启回到顶部
-  useOpenBackTop: true,
-  //  是否可以嵌入iframe页面
+  useOpenBackTop: false,
+  // 是否可以嵌入iframe页面
   canEmbedIFramePage: true,
   // 切换界面的时候是否删除未关闭的message及notify
   closeMessageOnSwitch: true,
diff --git a/src/utils/iframe.ts b/src/utils/iframe.ts
new file mode 100644
index 0000000..a5eb846
--- /dev/null
+++ b/src/utils/iframe.ts
@@ -0,0 +1,10 @@
+// 检测当前页面是否被嵌套在 iframe 中
+export function isInIframe(): boolean {
+  try {
+    return window.self !== window.top
+  }
+  catch (e) {
+    // 如果跨域访问被拒绝，catch 会捕获异常
+    return true
+  }
+}
diff --git a/src/views/infra/bookmark/event.data.ts b/src/views/infra/bookmark/event.data.ts
new file mode 100644
index 0000000..a8a49b1
--- /dev/null
+++ b/src/views/infra/bookmark/event.data.ts
@@ -0,0 +1,25 @@
+/**
+ * 第三方调用者发送事件格式
+ */
+export type ReceiveEventData =
+  | {
+    MessageId: 'OPEN_FILE'
+    Values: Blob | File
+  }
+  | {
+    MessageId: 'ACTION_SAVE'
+    Values?: null
+  }
+  | {
+    MessageId: never
+    Values?: never
+  }
+
+/**
+ * 浏览器主动回调第三方
+ */
+export type CallbackEventData =
+  | {
+    Action: 'SAVE'
+    Values?: never
+  }
diff --git a/src/views/infra/bookmark/index.vue b/src/views/infra/bookmark/index.vue
index e08bcfa..a73b030 100644
--- a/src/views/infra/bookmark/index.vue
+++ b/src/views/infra/bookmark/index.vue
@@ -1,17 +1,12 @@
 <script setup lang="ts">
 import { Button } from 'ant-design-vue'
-import { ref, watchEffect } from 'vue'
-import { useFileDialog } from '@vueuse/core'
-import { useRouter } from 'vue-router'
+import { ref } from 'vue'
+import { useEventListener } from '@vueuse/core'
 import { IFrame } from '@/components/IFrame'
 import { FileSelectModal } from '@/components/FileSelect'
 import { useModal } from '@/components/Modal'
 import type { FileVO } from '@/api/infra/file'
 import { initFilePreviewUrl } from '@/utils/file/preview'
-import type { BookmarkGenData, BookmarkQueryRespVo, PictureExData, TextExData } from '@/api/infra/bookmark'
-import { getAllBookmarks, getDoBookmarkReplace } from '@/api/infra/bookmark'
-import { useMessage } from '@/hooks/web/useMessage'
-import { convertFileToBase64 } from '@/utils/file/base64Conver'
 
 defineOptions({ name: 'BookmarkReplace' })
 
@@ -25,120 +20,13 @@ async function handleSelect(file: FileVO) {
   currentEditFile.value = file
 
   previewUrl.value = await initFilePreviewUrl(file.id)
-
-  await handleQueryBookmark()
 }
 
-const bookmarks = ref<BookmarkQueryRespVo[]>([])
-
-interface FormItemType {
-  name: string
-  type: 'PICTURE_DESC' | 'PICTURE' | 'TEXT'
-  value: string | File
-  fileName: string
-  width: number
-  height: number
-}
-
-const formItems = ref<FormItemType[]>([])
-const initFinish = ref<boolean>(false)
-watchEffect(() => {
-  if (currentEditFile.value) {
-    bookmarks.value = []
-    formItems.value = []
-  }
+useEventListener(document, 'message', (e) => {
+  console.log(e)
 })
 
-const { createMessage } = useMessage()
-
-async function handleQueryBookmark() {
-  bookmarks.value = []
-  formItems.value = []
-  initFinish.value = false
-  if (currentEditFile.value)
-    bookmarks.value = await getAllBookmarks(currentEditFile.value.id)
-
-  else
-    createMessage.error('请选择文件！')
-
-  for (const bk of bookmarks.value)
-    formItems.value.push({ name: bk.name, type: bk.type, value: '', fileName: '', width: 0, height: 0 })
-
-  initFinish.value = true
-}
-
-const { files, open, reset, onChange } = useFileDialog({
-  accept: 'image/*',
-  directory: false,
-})
-
-let currentEdit
-
-function handleSelectPicture(item: FormItemType) {
-  reset()
-  open()
-  currentEdit = item
-}
-
-onChange(() => {
-  if (files.value?.length && files.value?.length > 0 && currentEdit) {
-    const file = files.value.item(0)
-    if (file) {
-      currentEdit.value = file
-      currentEdit.fileName = file.name
-    }
-  }
-})
-
-const router = useRouter()
-
-async function handleGenerateNew() {
-  if (currentEditFile.value) {
-    const data: BookmarkGenData[] = []
-    for (const item of formItems.value) {
-      if (!item.value)
-        continue
-
-      if (item.type === 'TEXT') {
-        data.push({ name: item.name, extData: {
-          type: 'TEXT',
-          value: item.value as string,
-        } as TextExData })
-      }
-      if (item.type === 'PICTURE') {
-        const file = item.value as File
-        data.push({ name: item.name, extData: {
-          type: 'PICTURE',
-          value: await convertFileToBase64(item.value as File),
-          width: item.width,
-          height: item.height,
-          pictureName: file.name,
-          dataType: 'BASE64',
-        } as PictureExData })
-      }
-
-      if (item.type === 'PICTURE_DESC') {
-        const file = item.value as File
-        data.push({ name: item.name, extData: {
-          type: 'PICTURE_DESC',
-          value: await convertFileToBase64(item.value as File),
-          pictureName: file.name,
-          dataType: 'BASE64',
-        } as PictureExData })
-      }
-    }
-
-    if (data.length <= 0) {
-      createMessage.error('请填写替换值！')
-      return
-    }
-
-    const result = await getDoBookmarkReplace(currentEditFile.value.id, data)
-    const previewUrl = await initFilePreviewUrl(result)
-    const encode = encodeURIComponent(previewUrl)
-    await router.push(`/infra/file/file-preview?url=${encode}`)
-  }
-}
+// const { createMessage } = useMessage()
 </script>
 
 <template>
@@ -154,55 +42,12 @@ async function handleGenerateNew() {
               : {{ currentEditFile?.name }}
             </div>
             <div class="flex flex-row items-center">
-              <Button @click="handleQueryBookmark">
+              <Button>
                 获取书签
               </Button>
             </div>
           </div>
-          <div class="h-full w-full overflow-scroll rounded bg-white p-4 dark:bg-black">
-            <a-form
-              v-if="initFinish"
-              class="w-full"
-              layout="vertical"
-              :label-col="{ span: 16 }"
-            >
-              <a-col v-for="(item) in formItems" :key="item.name">
-                <a-form-item :label="item.name">
-                  <a-radio-group v-model:value="item.type" :disabled="item.type === 'PICTURE_DESC'" @change="item.value = null">
-                    <a-radio value="TEXT">
-                      文本
-                    </a-radio>
-                    <a-radio value="PICTURE">
-                      图片
-                    </a-radio>
-                    <a-radio v-if="item.type === 'PICTURE_DESC'" value="PICTURE_DESC" :disabled="true">
-                      图片（替换）
-                    </a-radio>
-                  </a-radio-group>
-                </a-form-item>
-                <a-form-item label="替换值">
-                  <a-input v-if="item.type === 'TEXT'" v-model:value="item.value" />
-                  <a-button v-if="item.type.includes('PICTURE')" @click="handleSelectPicture(item)">
-                    选择图片
-                  </a-button>
-                  <p v-if="item.type.includes('PICTURE') && item.value && item?.fileName" class="overflow-hidden">
-                    {{ item?.fileName }}
-                  </p>
-                </a-form-item>
-                <a-form-item v-if="item.type === 'PICTURE'" label="图片 宽(px)">
-                  <a-input v-model:value="item.width" type="number" />
-                </a-form-item>
-                <a-form-item v-if="item.type === 'PICTURE'" label="图片 高(px)">
-                  <a-input v-model:value="item.height" type="number" />
-                </a-form-item>
-                <a-divider />
-              </a-col>
-            </a-form>
-
-            <a-button v-if="formItems.length > 0" type="primary" @click="handleGenerateNew">
-              生成替换后文件
-            </a-button>
-          </div>
+          <div class="h-full w-full overflow-scroll rounded bg-white p-4 dark:bg-black" />
         </div>
         <div class="w-75% flex flex-row bg-white dark:bg-black">
           <i-frame v-if="previewUrl" class="w-full bg-white dark:bg-black" :src="previewUrl" height="calc(100vh - 105px)" />