<template>
  <!-- 一张图 排水设施统计 -->
  <div class="partTitleHM">排水设施统计</div>
  <div class="ppssCount partContHM">
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/bzIcon.png" alt="" />
      <div>
        <div>雨水泵站：<span>28座</span></div>
        <div>总规模：167.32m³/s</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/bzIcon.png" alt="" />
      <div>
        <div>污水泵站：<span>8个</span></div>
        <div>总规模：67.36m³/s</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/bzIcon.png" alt="" />
      <div>
        <div>雨污合建泵站：<span>2个</span></div>
        <div>总规模：17.41m³/s</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/gwIcon.png" alt="" />
      <div>
        <div>雨水管网</div>
        <div>总长度：357km</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/gwIcon.png" alt="" />
      <div>
        <div>污水管网</div>
        <div>总长度：275km</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/gwIcon.png" alt="" />
      <div>
        <div>合流管网</div>
        <div>总长度：150km</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/wscIcon.png" alt="" />
      <div>
        <div>污水处理厂：<span>5座</span></div>
        <div>总规模：41.82万吨/日</div>
      </div>
    </div>
    <div class="part flex">
      <img src="@/assets/newImgs/HMScreen/wscIcon.png" alt="" />
      <div>
        <div>供水厂：<span>3座</span></div>
        <div>总规模：68.7万吨/日</div>
      </div>
    </div>
  </div>
</template>

<script setup>
const { proxy } = getCurrentInstance();

onMounted(() => {});
</script>

<style lang="scss" scoped>
.ppssCount {
  width: 460px;
  background: #004565;
  padding: 10px 15px 0px;
  display: flex;
  flex-wrap: wrap;
  .part {
    width: 50%;
    margin-bottom: 10px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    font-size: 14px;
    color: #e4f5ff;
    align-items: center;
    img {
      width: 52px;
      height: 48px;
      margin-right: 5px;
    }
    span {
      font-family: YouSheBiaoTiHei;
      font-weight: 400;
      font-size: 20px;
      color: #ffffff;
      background: linear-gradient(0deg, #d5f6ff 0%, #6ac5ff 100%);
      background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  }
}
</style>