<template>
  <m-card title="物业体征">
    <m-sub :addition="{ value: totalCommunityCount, unit: '个小区' }">
      住宅房屋
    </m-sub>
    <Brief :list="summary" click-able @touch="onTouch" />
    <m-sub :addition="{ value: company, unit: '个' }"> 物业企业 </m-sub>
    <m-sub :addition="{ value: committee, unit: '个' }"> 业委会 </m-sub>
    <m-sub :addition="{ value: capital, unit: '万元', decimal: 2 }">
      维修资金
    </m-sub>
    <Summary title="续筹分布" :list="list" :avatar="avatar1" />
  </m-card>
</template>

<script lang="ts">
const _config = {
  name: 'A002',
  title: '物业体征',
  row: 2,
  apis: {
    community: '/service-customkey-ddd/public/communities/v2?pageSize=9000',
    nonResident: '/service-basicdatasync-ddd/public/nonResi/buildings',
    api1: '/service-basicdatasync-ddd/public/indCous',
    api2: '/service-basicdatasync-ddd/public/residentsCommitteesV2',
    api3: '/service-basicdatasync-ddd/public/propCompanies',
    capital: '/service-documents-ddd/public/maintenance/count/amt',
    amount: '/service-documents-ddd/public/houseContinuedWarnings',
  },
}
export default _config
</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 icon9 from '@/assets/images/icon9.png'
import c1 from '@/assets/images/c1.png'
import c2 from '@/assets/images/c2.png'
import c3 from '@/assets/images/c3.png'
import c4 from '@/assets/images/c4.png'
import c5 from '@/assets/images/c5.png'
import c6 from '@/assets/images/c6.png'
import avatar1 from '@/assets/images/avatar1.png'
import Brief, { BriefProp } from '@/components/brief.vue'
import Summary from '@/components/summary.vue'
import bus from '@/util/event-bus'
import { onMounted, ref } from 'vue'
import { ajax } from '@/ajax'

const totalCommunityCount = ref(0)
const summary = ref<BriefProp[]>([
  { icon: icon4, name: '商品房', value: 0 },
  { icon: icon5, name: '公房', value: 0 },
  { icon: icon1, name: '公租房', value: 0 },
  { icon: icon6, name: '混合', value: 0 },
  { icon: icon7, name: '军产', value: 0 },
  { icon: icon8, name: '售后房', value: 0 },
])

onMounted(() => {
  ajax
    .post({
      url: _config.apis.community,
      params: {
        conditions: [{ conditionsGroup: [] }],
        subject: 'tbl_community',
      },
    })
    .then((res) => {
      const data = res?.data?.content || []
      bus.emit('communityList', data)
      totalCommunityCount.value = data.length
      // 1商品房 2动迁房 3共有产权保障房 4售后房 5直管公房 6混合 7系统公房 8集体土地集资房 9军产 10私产 11公租房
      const list = {
        type1: data.filter((item) => item?.stKind == '01'),
        type2: data.filter(
          (item) => item?.stKind == '07' || item?.stKind == '05',
        ),
        type3: data.filter((item) => item?.stKind == '11'),
        type4: data.filter((item) => item?.stKind == '06'),
        type5: data.filter((item) => item?.stKind == '09'),
        type6: data.filter((item) => item?.stKind == '04'),
      }
      summary.value = [
        {
          icon: icon4,
          name: '商品房',
          value: list.type1?.length || 0,
          data: list.type1,
          point: c1,
          key: 1,
        },
        {
          icon: icon5,
          name: '公房',
          value: list.type2?.length || 0,
          data: list.type2,
          point: c2,
          key: 2,
        },
        {
          icon: icon1,
          name: '公租房',
          value: list.type3?.length || 0,
          data: list.type3,
          point: c3,
          key: 3,
        },
        {
          icon: icon6,
          name: '混合',
          value: list.type4?.length || 0,
          data: list.type4,
          point: c4,
          key: 4,
        },
        {
          icon: icon7,
          name: '军产',
          value: list.type5?.length || 0,
          data: list.type5,
          point: c5,
          key: 5,
        },
        {
          icon: icon8,
          name: '售后房',
          value: list.type6?.length || 0,
          data: list.type6,
          point: c6,
          key: 6,
        },
      ]
    })
})

const company = ref(0)
const committee = ref(0)
Promise.all([
  ajax.get({ url: _config.apis.api1, params: { sectType_in: '1' } }),
  ajax.get({
    url: _config.apis.api3,
    params: { sectType_in: '1', managedNum_desc: '1' },
  }),
]).then(([data1, data2]) => {
  committee.value = data1?.data?.totalRows || 0
  company.value = data2?.data?.totalRows || 0
})

const capital = ref(0)
ajax.get({ url: _config.apis.capital }).then((res) => {
  const { tranAmt = 0 } = res?.data?.content || {}
  capital.value = tranAmt / 10000
})
ajax.get({ url: _config.apis.amount }).then((res) => {
  const {
    yjmpzSum = 0, //门牌幢
    yjxqSum = 0, //小区
    yjfhSum = 0, //分户
  } = res?.data?.content || {}
  list.value = [
    { name: '分户', value: yjfhSum },
    { name: '门牌', value: yjmpzSum },
    { name: '小区', value: yjxqSum },
  ]
})

const list = ref([
  { name: '分户', value: 0 },
  { name: '门牌', value: 0 },
  { name: '小区', value: 0 },
])

const onTouch = (i: number) => {
  const { data, point, key } = summary.value[i]
  bus.emit('addPoints', { icon: point, data })
}
</script>

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