mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-07 17:07:19 +08:00
fix: 删除滚动支持
This commit is contained in:
parent
b1b236f736
commit
c3645fd760
@ -124,12 +124,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.scrollbar-wrapper {
|
|
||||||
position: absolute;
|
|
||||||
height: 40px;
|
|
||||||
overflow-x: hidden !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.right-button {
|
.right-button {
|
||||||
|
@ -40,12 +40,7 @@ import { useRoute, useRouter } from "vue-router";
|
|||||||
import { handleAliveRoute, delAliveRoutes } from "/@/router";
|
import { handleAliveRoute, delAliveRoutes } from "/@/router";
|
||||||
import { usePermissionStoreHook } from "/@/store/modules/permission";
|
import { usePermissionStoreHook } from "/@/store/modules/permission";
|
||||||
import { toggleClass, removeClass, hasClass } from "/@/utils/operate";
|
import { toggleClass, removeClass, hasClass } from "/@/utils/operate";
|
||||||
import {
|
import { RouteConfigs, relativeStorageType, tagsViewsType } from "../../types";
|
||||||
RouteConfigs,
|
|
||||||
relativeStorageType,
|
|
||||||
tagsViewsType,
|
|
||||||
scrollbarDomType
|
|
||||||
} from "../../types";
|
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@ -57,11 +52,11 @@ let relativeStorage: relativeStorageType;
|
|||||||
const showTags = ref(storageLocal.getItem("tagsVal") || false);
|
const showTags = ref(storageLocal.getItem("tagsVal") || false);
|
||||||
const tabDom = templateRef<HTMLElement | null>("tabDom", null);
|
const tabDom = templateRef<HTMLElement | null>("tabDom", null);
|
||||||
const containerDom = templateRef<HTMLElement | null>("containerDom", null);
|
const containerDom = templateRef<HTMLElement | null>("containerDom", null);
|
||||||
const scrollbarDom = templateRef<scrollbarDomType>("scrollbarDom", null);
|
const scrollbarDom = templateRef<HTMLElement | null>("scrollbarDom", null);
|
||||||
|
|
||||||
const handleScroll = (offset: number): void => {
|
const handleScroll = (offset: number): void => {
|
||||||
const scrollbarDomWidth = scrollbarDom.value?.wrap
|
const scrollbarDomWidth = scrollbarDom.value
|
||||||
? scrollbarDom.value?.wrap.offsetWidth
|
? scrollbarDom.value?.offsetWidth
|
||||||
: 0;
|
: 0;
|
||||||
const tabDomWidth = tabDom.value ? tabDom.value.offsetWidth : 0;
|
const tabDomWidth = tabDom.value ? tabDom.value.offsetWidth : 0;
|
||||||
if (offset > 0) {
|
if (offset > 0) {
|
||||||
@ -498,12 +493,7 @@ onBeforeMount(() => {
|
|||||||
<template>
|
<template>
|
||||||
<div ref="containerDom" class="tags-view" v-if="!showTags">
|
<div ref="containerDom" class="tags-view" v-if="!showTags">
|
||||||
<i class="ri-arrow-left-s-line" @click="handleScroll(200)"></i>
|
<i class="ri-arrow-left-s-line" @click="handleScroll(200)"></i>
|
||||||
<el-scrollbar
|
<div ref="scrollbarDom" class="scroll-container">
|
||||||
tag="span"
|
|
||||||
ref="scrollbarDom"
|
|
||||||
wrap-class="scrollbar-wrapper"
|
|
||||||
class="scroll-container"
|
|
||||||
>
|
|
||||||
<div
|
<div
|
||||||
class="tab"
|
class="tab"
|
||||||
ref="tabDom"
|
ref="tabDom"
|
||||||
@ -544,7 +534,7 @@ onBeforeMount(() => {
|
|||||||
></div>
|
></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-scrollbar>
|
</div>
|
||||||
<i class="ri-arrow-right-s-line" @click="handleScroll(-200)"></i>
|
<i class="ri-arrow-right-s-line" @click="handleScroll(-200)"></i>
|
||||||
<!-- 右键菜单按钮 -->
|
<!-- 右键菜单按钮 -->
|
||||||
<transition name="el-zoom-in-top">
|
<transition name="el-zoom-in-top">
|
||||||
|
Loading…
x
Reference in New Issue
Block a user