<!--
 * @Author: sjl
 * @Date: 2021-09-08 16:19:24
 * @Descripttion: 
-->
<template>
  <div class="xtjc-left-side">
    <!-- 测站统计 -->
    <stationStatistics />
    <rainCondition />
  </div>
</template>

<script lang="ts" setup>
// import {  } from 'vue';
// 测站统计组件
import stationStatistics from './components/stationStatistics.vue';
import rainCondition from './components/rainCondition.vue';
</script>
<style lang="less" scoped>
.xtjc-left-side {
  // position: fixed;
  position: absolute;
  left: 20px;
  top: 90px;
  z-index: 3;
  width: 430px;
  // overflow-y: auto;
  // overflow-x: hidden;
}

.xtjc-left-side {
  animation-name: move;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}

@keyframes move {
  0% {
    left: -400px;
  }

  100% {
    left: 20px;
  }
}
</style>
