<template>
  <div class="operation">
    <div class="o-card" v-for="(i,k) in datas" :key="k">
      <div class="p-left">
       <img :src="require('@/assets/images/icon4.png')" alt="">
      </div>
      <div class="p-right">
        <p>{{i.title}}</p>
        <span>{{i.num}}</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name:'operation',
  props:{

  },
  data(){
    return {
      datas: [
        {
          title:'小区',
          img:'',
          num:'2829',
        },
        {
          title:'业委会',
          img:'',
          num:'1749',
        },
        {
          title:'物业企业',
          img:'',
          num:'498',
        },
        {
          title:'管理面积',
          img:'',
          num:'173377718',
        },
      ]
    }
  },
  methods:{

  }

}
</script>

<style lang="stylus" scoped>
.operation
  display flex
  flex-wrap:wrap
  height 100%
  width 100%
.o-card
  flex 0 0 50%
  display flex
.p-left
  display flex
  align-items: center
img
  width 3.125rem /* 50/16 */
  height 3.125rem /* 50/16 */
  align-items: center
  margin 5px
.p-right
  display flex
  flex-direction column
  justify-content center
  text-align left
  p
    font-size .8rem
    color skyblue
  span
    font-size 1.25rem
</style>

