实现Area最大化时自动同步Panel最大化状态,完成第10点需求
This commit is contained in:
@@ -51,7 +51,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, defineExpose, nextTick } from 'vue'
|
import { ref, defineExpose, nextTick, watch } from 'vue'
|
||||||
import Area from './Area.vue';
|
import Area from './Area.vue';
|
||||||
import Panel from './Panel.vue';
|
import Panel from './Panel.vue';
|
||||||
|
|
||||||
@@ -265,6 +265,23 @@ const onPanelDragEnd = () => {
|
|||||||
panelDragState.value.currentAreaId = null
|
panelDragState.value.currentAreaId = null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 监听floatingAreas变化,确保当Area最大化时,Panel也会自动最大化
|
||||||
|
watch(floatingAreas, (newAreas) => {
|
||||||
|
newAreas.forEach(area => {
|
||||||
|
// 当区域只包含一个Panel且Area状态变为最大化时,Panel也应该最大化
|
||||||
|
if (area.panels && area.panels.length === 1) {
|
||||||
|
const isAreaMaximized = area.WindowState === '最大化' || area.WindowState === 'maximized';
|
||||||
|
const isPanelMaximized = area.panels[0].maximized;
|
||||||
|
|
||||||
|
// 如果状态不一致,更新Panel的maximized属性
|
||||||
|
if (isAreaMaximized !== isPanelMaximized) {
|
||||||
|
area.panels[0] = { ...area.panels[0], maximized: isAreaMaximized };
|
||||||
|
console.log(`Area ${area.id} 状态变化,同步Panel最大化状态为:`, isAreaMaximized);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, { deep: true });
|
||||||
|
|
||||||
// 暴露方法给父组件
|
// 暴露方法给父组件
|
||||||
defineExpose({
|
defineExpose({
|
||||||
addFloatingPanel
|
addFloatingPanel
|
||||||
|
|||||||
Reference in New Issue
Block a user