<template> <!-- 防汛排涝 监测预警 --> <div class="Jianceyujin"> <!-- 左侧监测预警 --> <Transition name="fade_left"> <MonitoringWarningLeft v-show="!showPanel"></MonitoringWarningLeft> </Transition> <!-- 右侧监测预警 --> <Transition name="fade_right"> <MonitoringWarningRigh v-show="!showPanel"></MonitoringWarningRigh> </Transition> <PanelDisplayHidden @showPanelChange="PanelChange"></PanelDisplayHidden> </div> </template> <script setup name="Jianceyujin"> import { ref, reactive, onMounted } from 'vue'; import MonitoringWarningLeft from './MonitoringWarningLeft/index.vue'; import MonitoringWarningRigh from './MonitoringWarningRigh/index.vue'; // 面板控制组件 import PanelDisplayHidden from '@/views/pictureOnMap/page/components/PanelDisplayHidden.vue'; const showPanel = ref(false); //面板展开收起 const PanelChange = val => { showPanel.value = val; }; const { proxy } = getCurrentInstance(); onMounted(() => {}); </script> <style lang="scss" scoped> .Jianceyujin { } </style>