fix: 修复点击iframe页面无法关闭右键标签页面板以及右键标签页面板被遮挡的问题

This commit is contained in:
xiaoxian521 2023-10-30 23:33:53 +08:00
parent a0c56e99b7
commit 02c2e4fc4b
3 changed files with 8 additions and 11 deletions

View File

@ -6,10 +6,10 @@ import { useTags } from "../../hooks/useTag";
import { routerArrays } from "@/layout/types";
import { handleAliveRoute, getTopMenu } from "@/router/utils";
import { useSettingStoreHook } from "@/store/modules/settings";
import { useResizeObserver, useFullscreen } from "@vueuse/core";
import { isEqual, isAllEmpty, debounce } from "@pureadmin/utils";
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
import { ref, watch, unref, toRaw, nextTick, onBeforeUnmount } from "vue";
import { useResizeObserver, useFullscreen, onClickOutside } from "@vueuse/core";
import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
@ -49,6 +49,7 @@ const {
const tabDom = ref();
const containerDom = ref();
const scrollbarDom = ref();
const contextmenuRef = ref();
const isShowArrow = ref(false);
const topPath = getTopMenu()?.path;
const { VITE_HIDE_HOME } = import.meta.env;
@ -328,6 +329,7 @@ function handleCommand(command: any) {
/** 触发右键中菜单的点击事件 */
function selectTag(key, item) {
closeMenu();
onClickDrop(key, item, currentSelect.value);
}
@ -462,6 +464,10 @@ function tagOnClick(item) {
// showMenuModel(item?.path, item?.query);
}
onClickOutside(contextmenuRef, closeMenu, {
detectIframe: true
});
watch(route, () => {
activeIndex.value = -1;
dynamicTagView();
@ -558,6 +564,7 @@ onBeforeUnmount(() => {
<transition name="el-zoom-in-top">
<ul
v-show="visible"
ref="contextmenuRef"
:key="Math.random()"
:style="getContextMenuStyle"
class="contextmenu"

View File

@ -58,7 +58,6 @@ onMounted(() => {
.frame {
position: absolute;
inset: 0;
z-index: 998;
.frame-iframe {
box-sizing: border-box;

View File

@ -1,7 +1,6 @@
import {
ref,
unref,
watch,
computed,
reactive,
onMounted,
@ -9,7 +8,6 @@ import {
getCurrentInstance
} from "vue";
import { tagsViewsType } from "../types";
import { useEventListener } from "@vueuse/core";
import { useRoute, useRouter } from "vue-router";
import { transformI18n, $t } from "@/plugins/i18n";
import { responsiveStorageNameSpace } from "@/config";
@ -215,13 +213,6 @@ export function useTags() {
}
});
watch(
() => visible.value,
() => {
useEventListener(document, "click", closeMenu);
}
);
return {
route,
router,