实现Area组件第9条需求:当内容区只包含一个Panel时,点击Panel的最大化按钮同时最大化Area
This commit is contained in:
@@ -91,8 +91,8 @@
|
||||
|
||||
<!-- 内容区域 -->
|
||||
<div class="vs-content">
|
||||
<!-- 这里是内容区域,使用slot接收子组件 -->
|
||||
<slot></slot>
|
||||
<!-- 这里是内容区域,使用slot接收子组件,并监听Panel的maximize事件 -->
|
||||
<slot @maximize="onPanelMaximize"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -215,6 +215,18 @@ const areaStyle = computed(() => {
|
||||
|
||||
const emit = defineEmits(['close', 'update:WindowState', 'update:position'])
|
||||
|
||||
// 处理Panel的最大化事件
|
||||
const onPanelMaximize = (panelId) => {
|
||||
// 检查内容区是否只有一个Panel
|
||||
const panelChildren = $slots.default ? $slots.default() : []
|
||||
const isSinglePanel = panelChildren.length === 1
|
||||
|
||||
if (isSinglePanel) {
|
||||
// 如果只有一个Panel,则切换Area的最大化状态
|
||||
onToggleMaximize()
|
||||
}
|
||||
}
|
||||
|
||||
// 拖拽开始
|
||||
const onDragStart = (e) => {
|
||||
// 最大化状态下不允许拖拽
|
||||
|
||||
Reference in New Issue
Block a user