<template>
  <m-card title="物业体征">
    <m-sub :addition="{ value: 1674, unit: '个小区' }"> 住宅房屋 </m-sub>
    <Brief :list="summary" />
    <m-sub :addition="{ value: 1264, unit: '个' }"> 物业企业 </m-sub>
    <m-sub :addition="{ value: 1015, unit: '个' }"> 业委会 </m-sub>
    <m-sub :addition="{ value: 1684, unit: '万元' }"> 维修资金 </m-sub>
    <Summary title="续筹分布" :list="list" :avatar="avatar1" />
  </m-card>
</template>

<script lang="ts">
export default {
  name: 'A002',
  title: '物业体征',
  row: 2,
}
</script>
<script lang="ts" setup>
import icon4 from '@/assets/images/icon4.png'
import icon5 from '@/assets/images/icon5.png'
import icon1 from '@/assets/images/icon1.png'
import icon6 from '@/assets/images/icon6.png'
import icon7 from '@/assets/images/icon7.png'
import icon8 from '@/assets/images/icon8.png'
import avatar1 from '@/assets/images/avatar1.png'
import Brief from '@/components/brief.vue'
import Summary from '@/components/summary.vue'
import eventBus from '@/util/event-bus'
import { ref } from 'vue'

const summary = [
  { icon: icon4, name: '商品房', value: 904 },
  { icon: icon5, name: '公房', value: 400 },
  { icon: icon1, name: '私房/农房', value: 130 },
  { icon: icon6, name: '商住混合', value: 82 },
  { icon: icon7, name: '军产', value: 12 },
  { icon: icon8, name: '保障房', value: 46 },
]
const list = ref([
  { name: '分户', value: 47520 },
  { name: '门牌', value: 3960 },
  { name: '小区', value: 45 },
])
eventBus.on('update:A002', (data: any) => {
  list.value = data
})
</script>

<style lang="stylus" scoped>
@import  '../../components/MyComponent/main.styl'
</style>
