实现功能:当内容区只包含一个Panel时,拖动Panel标题栏可以移动Area

This commit is contained in:
zqm
2025-11-04 11:30:51 +08:00
parent 81ef6b126a
commit 8d5b39cb12
2 changed files with 13 additions and 13 deletions

View File

@@ -105,17 +105,17 @@ const addFloatingPanel = () => {
showTitleBar: true,
// 添加一个Panel填充满父容器
panels: [
{
id: `panel-${areaIdCounter - 1}-1`,
title: `面板 1`,
x: 0,
y: 0,
width: 300, // 与Area宽度相同
height: 250, // 与Area高度相同
collapsed: false,
toolbarExpanded: false
}
]
{
id: `panel-${areaIdCounter - 1}-1`,
title: `面板 1`,
x: 0,
y: 0,
width: 100,
height: 100,
collapsed: false,
toolbarExpanded: false
}
]
}
floatingAreas.value.push(newArea)
}

View File

@@ -1,6 +1,6 @@
<template>
<div class="panel absolute bg-white shadow rounded border overflow-hidden"
:style="{ top: y + 'px', left: x + 'px', width: width + 'px', height: height + 'px' }">
<div class="panel bg-white shadow overflow-hidden"
:style="{ width: '100%', height: '100%' }">
<div class="flex flex-col h-full">
<!-- 标题栏 -->
<div class="title-bar h-6 bg-[#435d9c] text-white px-2 flex items-center justify-between select-none cursor-move"