修改DockLayout.vue,调整主区域和浮动区域的定位样式实现层叠显示

This commit is contained in:
zqm
2025-11-07 14:44:07 +08:00
parent a6026f7179
commit 145b82ecf9

View File

@@ -5,8 +5,9 @@
:WindowState="windowState" :WindowState="windowState"
:showTitleBar="false" :showTitleBar="false"
title="主区域" title="主区域"
:style="{ position: 'relative', zIndex: 1 }" :style="{ position: 'absolute', top: 0, left: 0, width: '100%', height: '100%', zIndex: 1 }"
> >
</Area>
<!-- 浮动区域列表 --> <!-- 浮动区域列表 -->
<Area <Area
v-for="area in floatingAreas" v-for="area in floatingAreas"
@@ -21,8 +22,15 @@
:top="area.WindowState !== '最大化' ? area.y : undefined" :top="area.WindowState !== '最大化' ? area.y : undefined"
:style="area.WindowState !== '最大化' ? { :style="area.WindowState !== '最大化' ? {
position: 'absolute', position: 'absolute',
zIndex: 10 zIndex: 10,
background: 'rgba(255, 255, 255, 1)',
border: '1px solid #4f72b3'
} : { } : {
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
zIndex: 100 zIndex: 100
}" }"
@close="onCloseFloatingArea(area.id)" @close="onCloseFloatingArea(area.id)"
@@ -59,7 +67,6 @@
/> />
</TabPage> </TabPage>
</Area> </Area>
</Area>
</div> </div>
</template> </template>