<template>
  <div class="special-inspection">
    <p>已查/应查</p>
    <div class="number">
      <p><m-count class="count blue" :value="68" :decimal="0" />/<m-count class="count" :value="158" :decimal="0" /></p>
    </div>
    <div class="bar">
      <div class="inner" :style="`width:${0.8 * 100}%;`"></div>
    </div>
    <div class="content">
      <img src="@/assets/images/icon1.png"/>
      <p>已有主题</p>
      <div class="line" />
      <m-count class="count" :value="16" :decimal="0" />
    </div>
    <div class="content">
      <img src="@/assets/images/icon2.png"/>
      <p>已完成检查小区</p>
      <div class="line" />
      <m-count class="count" :value="92" :decimal="0" />
    </div>
    <p>已完成整改/已开整改单</p>
    <div class="number">
      <p><m-count class="count blue" :value="25" :decimal="0" />%</p>
      <p><m-count class="count blue" :value="4" :decimal="0" />/<m-count class="count" :value="16" :decimal="0" /></p>
    </div>
    <div class="bar">
      <div class="inner" :style="`width:${0.25 * 100}%;`"></div>
    </div>
    <div class="number">
      <p><m-count class="count blue" :value="16" :decimal="0" />%</p>
    </div>
    <div class="bar">
      <div class="inner" :style="`width:${0.16 * 100}%;`"></div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'SpecialInspection',
  data() {
    return {}
  },
}
</script>

<style lang="stylus" scoped>
.special-inspection
  display flex
  flex-direction column
  justify-content space-around
  .count
    font-size .12rem
    &.blue
      color #5bd5ff
  .content
    display flex
    align-items center
    img
      width .15rem
      height @width
      margin-right .05rem
    .line
      flex 1
      height .01rem
      border-bottom .01rem dashed rgba(51,145,255,.4)
      margin 0 .05rem
  .number
    display flex
    align-items center
    justify-content space-between
    font-size .12rem
    font-weight bold
  .bar
    width 100%
    height .08rem
    border-radius .01rem
    background #19487F
    >.inner
      height 99%
      border-radius inherit
      background #FFD400
</style>
