<template>
  <m-card title="业务入口">
    <div class="content">
      <div @click="routeTo('527635870583459840')">振兴小区</div>
      <div @click="routeTo('527635870583459841')">威海路62弄小区</div>
    </div>
  </m-card>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import { useRouter } from 'vue-router'
export default defineComponent({
  name: 'BussinessEntry',
  setup() {
    const router = useRouter()
    const routeTo = (id: string) => {
      router.push({
        name: 'community',
        query: {
          id,
        },
      })
    }
    return {
      routeTo,
    }
  },
})
</script>

<style lang="stylus" scoped>
.content
  width 100%
  height 100%
  display flex
  align-items center
  justify-content space-around
  >div
    width 40%
    min-height 70%
    background url('@/assets/images/num-card.png') 100% / 100% 100% no-repeat
    display flex
    align-items center
    justify-content center
    font-size .12rem
    font-weight bold
    cursor pointer
    opacity 0.8
    color #ccc
    &:hover
      color #fff
      opacity 1
</style>
