<template>
  <div class="publicContainerA">
    <div class="partTitleHM">项目评估</div>
    <div class="ConstrucClass">
      <div class="WaterAccumulation">
        <div class="HeadContent">
          <span>积水分析</span>
        </div>
        <div class="assessment">
          <AssessmentEcharts :data="chartData2" :refresh="chartData2.refresh"></AssessmentEcharts>
        </div>
      </div>

      <div class="WaterList">
        <div class="DropdownBox">11</div>
      </div>
    </div>
  </div>
</template>

<script setup>
import AssessmentEcharts from '@/views/sponeScreen/Echarts/AssessmentEcharts.vue'; // 积水分析

const chartData2 = ref({
  xAxis: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
  yAxis: [650, 800, 502, 630, 820, 800, 510, 805, 1203],
  yAxis2: [7, 9, 10, 9, 11, 10, 12, 15, 18],
  refresh: 1,
});
const refresh = ref(1);
</script>

<style lang="scss" scoped>
.publicContainerA {
  margin-top: 10px;
}
.ConstrucClass {
  width: 100%;
  height: calc(100vh - 580px);
  background: #07347f;
  .WaterAccumulation {
    width: 95%;
    height: 200px;
    margin: auto;
    // background: yellow;
    .HeadContent {
      width: 100%;
      height: 40px;
      background: #217dc8;
      border: 1px solid #61aff0;
      position: relative;
      top: 2px;
    }
    .assessment {
      width: 100%;
      height: 160px;
      // background: red;
    }
  }
  .WaterList {
    width: 95%;
    margin-top: 10px;
    height: calc(100% - 210px);
    margin: auto;
    background: red;
    .DropdownBox {
      height: 55px;
      background: yellow;
    }
  }
}
</style>