<template>
  <div class="xtjc-left-side" v-show="mapStore.rightSideMenu">
    <!-- 水情监测 -->
    <regimen />
  </div>
</template>

<script lang="ts" setup>
import regimen from './components/regimen.vue';
import { useMapStore } from '/@/store/modules/map';
const mapStore = useMapStore();
</script>
<style lang="less" scoped>
.xtjc-left-side {
  // position: fixed;
  position: absolute;
  right: 20px;
  top: 90px;
  z-index: 3;
  width: 400px;
  // height: 100%;
}
.xtjc-left-side {
  animation-name: move;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}
@keyframes move {
  0% {
    right: -400px;
  }
  100% {
    right: 20px;
  }
}
</style>
