<template>
  <view class="day-risk">
    <h2>日风险概况</h2>
    <view class="data-container">
      <view class="left-content">
        <text>本月风险数</text>
        <text>{{ monthNum }}</text>
        <text>累计总数： {{ monthAmount }}</text>
      </view>
      <view class="left-right">
        <text>本周风险数</text>
        <text>{{ weekNum }}</text>
        <text>累计总数： {{ weekAmount }}</text>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      monthNum: 1420,
      monthAmount: 9520,
      weekNum: 320,
      weekAmount: 9820
    }
  },
  methods: {
    getRiskNumData() {}
  },
  mounted() {
    this.getRiskNumData()
  }
}
</script>

<style lang="scss" scoped>
.day-risk {
  .data-container {
    display: flex;
    justify-content: space-between;
    color: #fff;
    font-size: 26rpx;
    view {
      width: 49%;
      height: 180rpx;
      display: flex;
      flex-direction: column;
      justify-content: space-around;

      text {
        text-align: left;
        padding-left: 20rpx;
      }

      text:nth-child(2) {
        font-weight: bold;
        font-size: 36rpx;
      }
    }
    .left-content {
      background: url('../../../../static/images/workPlan/month_img.png') no-repeat;
      background-size: 100% 100%;
    }
    .left-right {
      background: url('../../../../static/images/workPlan/week_img.png') no-repeat;
      background-size: 100% 100%;
    }
  }
}
</style>
