parent
719c9a8f2d
commit
c432e0ac33
@ -69,7 +69,13 @@ const tabsView = computed((): TabConfig[] => {
|
|||||||
v-for="(tab, i) in tabsView"
|
v-for="(tab, i) in tabsView"
|
||||||
:key="tab.key"
|
:key="tab.key"
|
||||||
ref="tabRef"
|
ref="tabRef"
|
||||||
:class="[{ 'is-active': tab.key === active, draggable: !tab.affixTab }]"
|
:class="[
|
||||||
|
{
|
||||||
|
'is-active': tab.key === active,
|
||||||
|
draggable: !tab.affixTab,
|
||||||
|
'affix-tab': tab.affixTab,
|
||||||
|
},
|
||||||
|
]"
|
||||||
:data-active-tab="active"
|
:data-active-tab="active"
|
||||||
:data-index="i"
|
:data-index="i"
|
||||||
class="tabs-chrome__item draggable translate-all group relative -mr-3 flex h-full select-none items-center"
|
class="tabs-chrome__item draggable translate-all group relative -mr-3 flex h-full select-none items-center"
|
||||||
|
@ -76,6 +76,7 @@ const tabsView = computed((): TabConfig[] => {
|
|||||||
{
|
{
|
||||||
'is-active dark:bg-accent bg-primary/15': tab.key === active,
|
'is-active dark:bg-accent bg-primary/15': tab.key === active,
|
||||||
draggable: !tab.affixTab,
|
draggable: !tab.affixTab,
|
||||||
|
'affix-tab': tab.affixTab,
|
||||||
},
|
},
|
||||||
typeWithClass.content,
|
typeWithClass.content,
|
||||||
]"
|
]"
|
||||||
|
@ -81,7 +81,14 @@ export function useTabsDrag(props: TabsProps, emit: EmitType) {
|
|||||||
},
|
},
|
||||||
onMove(evt) {
|
onMove(evt) {
|
||||||
const parent = findParentElement(evt.related);
|
const parent = findParentElement(evt.related);
|
||||||
return parent?.classList.contains('draggable') && props.draggable;
|
if (parent?.classList.contains('draggable') && props.draggable) {
|
||||||
|
const isCurrentAffix = evt.dragged.classList.contains('affix-tab');
|
||||||
|
const isRelatedAffix = evt.related.classList.contains('affix-tab');
|
||||||
|
// 不允许在固定的tab和非固定的tab之间互相拖拽
|
||||||
|
return isCurrentAffix === isRelatedAffix;
|
||||||
|
} else {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
onStart: () => {
|
onStart: () => {
|
||||||
el.style.cursor = 'grabbing';
|
el.style.cursor = 'grabbing';
|
||||||
|
Loading…
Reference in New Issue
Block a user