档案弹窗基本完成（业委会成员/设施设备/公共设施暂无数据）

src/ajax/api.ts

@@ -24,9 +24,11 @@ export default {
   GET_LIST: '/service-special-nandong/classifyAddrs', // 根据地址搜索
   GET_ROOM: '/service-special-nandong/households', // 获取分户
   GET_PERSON: '/service-special-nandong/personnels', // 实有人口
-  GET_COMMUNITY_DETAIL: '/service-basicdatasync-ddd/communities',
+  GET_COMMUNITY: '/service-basicdatasync-ddd/communities',
+  GET_MANAGE: '/service-basicdatasync-ddd/css', // 小区管理处
   GET_BUILDING: '/service-basicdatasync-ddd/building', // 门牌幢列表
   GET_INDUSTRY_AUTHORITY: '/service-basicdatasync-ddd/indCous', // 业委会列表
+  GET_HOC_MEMBER: '/service-basicdatasync-ddd/indcou/members', // 业委会成员
   GET_COMMITTEE: '/service-basicdatasync-ddd/residentsCommittees', // 居委会列表
   GET_COMPANY: '/service-basicdatasync-ddd/propCompanies', // 物业列表
   GET_CASE: '/service-special-nandong/compairs', // 案件汇总列表

src/components/MyComponent/MyTable/my-table.vue

@@ -177,7 +177,7 @@ export default defineComponent({
           background transparent
   $full()
   p
-    padding .05rem
+    padding 0 .05rem
     margin 0
     flex 1
     box-sizing border-box

src/view/components/community-list.vue

+<template>
+  <div class="community-list" :class="{ 'select-able': selectAble }">
+    <template v-if="list && list.length > 0">
+      <div
+        v-for="(item, i) in list"
+        :key="i"
+        class="community-item"
+        @click="handleClick(item)"
+      >
+        <div>
+          <p>{{ item.stNameFrst }}</p>
+          <span>
+            <b>{{ item.sectTypeName }}</b>
+          </span>
+          <template v-if="item.cmtName"> | {{ item.cmtName }} | </template>
+        </div>
+        <p>{{ item.addrFrst }}</p>
+        <p>{{ item.cspName }}</p>
+      </div>
+    </template>
+    <m-empty v-else :img="empty" hidden-text />
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType, ref } from 'vue'
+import empty from '@/assets/images/empty.png'
+
+export default defineComponent({
+  name: 'CommunityList',
+  props: {
+    list: {
+      type: Array as PropType<any[] | null>,
+      default: () => {
+        return []
+      },
+    },
+    selectAble: {
+      type: Boolean as PropType<boolean>,
+      default: false,
+    },
+  },
+  emits: ['select'],
+  setup(_, ctx) {
+    const handleClick = (data: unknown) => {
+      ctx.emit('select', data)
+    }
+    const data = ref<any>([])
+    return {
+      data,
+      empty,
+      handleClick,
+    }
+  },
+})
+</script>
+
+<style lang="stylus" scoped>
+@import '../../components/MyComponent/main.styl'
+
+.community-list
+  width 100%
+  height 100%
+  padding-right .05rem
+  overflow-y auto
+  &.select-able
+    .community-item
+      cursor pointer
+      transition all .1s ease
+      &:hover
+        background rgba(70,83,97,.25)
+        box-shadow none
+  .community-item
+    position relative
+    margin-bottom .08rem
+    padding .05rem .08rem
+    overflow hidden
+    background rgba(70,83,97,.45)
+    box-shadow 0 0 .04rem 0 rgba(44,51,70,.65), inset 0 .01rem .02rem 0 rgba(204,204,204,.2)
+    border-radius .04rem
+    >p
+      &:nth-of-type(1)
+        color #ccc
+      &:nth-of-type(2)
+        color $blue
+    >div
+      display flex
+      align-items center
+      border-bottom .01rem dotted rgba(91,213,255,.5)
+      margin-bottom .08rem
+      padding-bottom .06rem
+      color #ccc
+      p
+        font-size .11rem
+        font-weight bold
+        color #fff
+      span
+        display inline-block
+        font-size .08rem
+        padding 0 .06rem
+        border-radius .08rem
+        margin 0 .1rem
+        transform skew(-30deg)
+        background $edge
+        >b
+          display inline-block
+          transform skew(30deg)
+          font-weight normal
+          color #000
+</style>

src/view/components/search-view.vue

@@ -26,7 +26,9 @@
       <template v-else-if="searchType === 'population'">
         <PersonList :list="list" select-able @select="handleSelect" />
       </template>
-      <template v-else-if="searchType === 'community'"></template>
+      <template v-else-if="searchType === 'community'">
+        <CommunityList :list="list" select-able @select="handleSelect" />
+      </template>
     </template>
     <m-empty v-else />
   </div>
@@ -63,6 +65,7 @@ import CommunityDrawer from '@/view/drawers/community-drawer.vue'
 import { ajax, api } from '@/ajax'
 import CaseList from './case-list.vue'
 import PersonList from './person-list.vue'
+import CommunityList from './community-list.vue'
 
 export default defineComponent({
   name: 'SearchView',
@@ -72,6 +75,7 @@ export default defineComponent({
     CommunityDrawer,
     CaseList,
     PersonList,
+    CommunityList,
   },
   setup() {
     const searchType = ref('case')
@@ -96,15 +100,34 @@ export default defineComponent({
       ).data
       return content
     }
-    const searchCommunity = async (address: string, pageSize = 100) => {
+    const searchCommunity = async (
+      address: unknown,
+      sectId: unknown,
+      pageSize = 100
+    ) => {
       const { content } = (
         await ajax.get({
-          url: api.GET_LIST,
-          params: { pageSize, addr_l: address, classifyName: '小区' },
+          url: api.GET_COMMUNITY,
+          params: { addrFrst_l: address, pageSize, sectId },
         })
       ).data
       return content
     }
+    const searchBuilding = async (params: any) => {
+      const { content } = (
+        await ajax.get({
+          url: api.GET_BUILDING,
+          params: { ...params, pageSize: 100 },
+        })
+      ).data
+      return content
+    }
+    const searchCompany = async (id: string) => {
+      const { content } = (
+        await ajax.get({ url: api.GET_COMPANY, params: { cspId: id } })
+      ).data
+      return content
+    }
     const handleSearch = async () => {
       const address = searchKey.value
       switch (searchType.value) {
@@ -115,7 +138,7 @@ export default defineComponent({
           list.value = await searchRoom(address)
           break
         case 'community':
-          list.value = await searchCommunity(address)
+          list.value = await searchCommunity(address, null)
           break
         default:
           list.value = []
@@ -132,82 +155,151 @@ export default defineComponent({
     const caseInfo = ref<any>(null)
     const roomInfo = ref<any>(null)
     const buildingInfo = ref<any>(null)
-    const handleSelect = async (item: any) => {
-      caseInfo.value = item
-      if (item.communityId) {
-        const { content } = (
-          await ajax.get({
-            url: api.GET_COMMUNITY_DETAIL,
-            params: { sectId: item.communityId },
-          })
-        ).data
+    const handleSelect = async (item: unknown) => {
+      switch (searchType.value) {
+        case 'case':
+          await selectCase(item)
+          break
+        case 'population':
+          await selectRoom(item)
+          break
+        case 'community':
+          await selectCommunity(item)
+          break
+        default:
+          communityModal.value = false
+          populationModal.value = false
+          caseModal.value = false
+          break
+      }
+    }
+    async function selectCase(data: any) {
+      caseInfo.value = data
+      if (data.communityId) {
+        const content = await searchCommunity(null, data.communityId)
         communityInfo.value = content && content[0]
         const cspId = content && content[0] && content[0].cspId
         if (cspId) {
-          const { content } = (
-            await ajax.get({ url: api.GET_COMPANY, params: { cspId } })
-          ).data
+          const content = await searchCompany(cspId)
           propertyInfo.value = content && content[0]
         }
       } else {
         communityInfo.value = {}
         propertyInfo.value = {}
       }
-      if (searchType.value === 'case') {
-        caseModal.value = true
-        populationModal.value = false
-        communityModal.value = false
-      } else {
-        const { content } = (
-          await ajax.get({
-            url: api.GET_CASE,
-            params: { pageSize: 200, address_l: item.address || item.addr },
-          })
-        ).data
-        caseInfo.value = content || []
-        if (searchType.value === 'population') {
-          if (item.addr) {
+      caseModal.value = true
+      populationModal.value = false
+      communityModal.value = false
+    }
+    async function selectRoom(data: any) {
+      roomInfo.value = data
+      const content = await searchCase(data.address || data.addr)
+      caseInfo.value = content || []
+      const { buildingId } = data
+      if (buildingId) {
+        const content = await searchBuilding({ unitId: buildingId })
+        buildingInfo.value = content && content[0]
+        const sectId = content && content[0] && content[0].sectId
+        if (sectId) {
+          const content = await searchCommunity(null, sectId)
+          communityInfo.value = content && content[0]
+          const csId = communityInfo.value && communityInfo.value.csId
+          if (csId) {
             const { content } = (
-              await ajax.get({ url: api.GET_ROOM, params: { addr: item.addr } })
+              await ajax.get({
+                url: api.GET_MANAGE,
+                params: { csId },
+              })
             ).data
-            roomInfo.value = content && content[0]
-            const buildingId = content && content[0] && content[0].buildingId
-            if (buildingId) {
-              const { content } = (
-                await ajax.get({
-                  url: api.GET_BUILDING,
-                  params: { unitId: buildingId },
-                })
-              ).data
-              buildingInfo.value = content && content[0]
-              const sectId = content && content[0] && content[0].sectId
-              if (sectId) {
-                const { content } = (
-                  await ajax.get({
-                    url: api.GET_COMMUNITY_DETAIL,
-                    params: { sectId },
-                  })
-                ).data
-                communityInfo.value = content && content[0]
-              } else {
-                communityInfo.value = null
-              }
-            } else {
-              buildingInfo.value = null
-            }
+            communityInfo.value.manageInfo = (content && content[0]) || {}
           } else {
-            roomInfo.value = null
+            communityInfo.value.manageInfo = {}
           }
-
-          populationModal.value = true
-          caseModal.value = false
-          communityModal.value = false
-        } else if (searchType.value === 'community') {
-          communityModal.value = true
-          populationModal.value = false
-          caseModal.value = false
+          const hocId = communityInfo.value && communityInfo.value.hocId
+          if (hocId) {
+            const { content } = (
+              await ajax.get({
+                url: api.GET_INDUSTRY_AUTHORITY,
+                params: { hocId },
+              })
+            ).data
+            communityInfo.value.hocInfo = (content && content[0]) || {}
+            const { content: memberList } = (
+              await ajax.get({
+                url: api.GET_HOC_MEMBER,
+                params: { hocId },
+              })
+            ).data
+            communityInfo.value.hocInfo.memberList = memberList || []
+          } else {
+            communityInfo.value.hocInfo = {}
+          }
+          const cspId = communityInfo.value && communityInfo.value.cspId
+          if (cspId) {
+            const content = await searchCompany(cspId)
+            propertyInfo.value = content && content[0]
+          } else {
+            propertyInfo.value = {}
+          }
+          communityInfo.value.buildingList =
+            (await searchBuilding({ sectId })) || []
+        } else {
+          communityInfo.value = {}
         }
+      } else {
+        buildingInfo.value = {}
+      }
+      populationModal.value = true
+      caseModal.value = false
+      communityModal.value = false
+    }
+    async function selectCommunity(data: any) {
+      const content = await searchCase(data.addrFrst)
+      caseInfo.value = content || []
+      communityInfo.value = data
+      const csId = communityInfo.value && communityInfo.value.csId
+      if (csId) {
+        const { content } = (
+          await ajax.get({
+            url: api.GET_MANAGE,
+            params: { csId },
+          })
+        ).data
+        communityInfo.value.manageInfo = (content && content[0]) || {}
+      } else {
+        communityInfo.value.manageInfo = {}
+      }
+      const hocId = communityInfo.value && communityInfo.value.hocId
+      if (hocId) {
+        const { content } = (
+          await ajax.get({
+            url: api.GET_INDUSTRY_AUTHORITY,
+            params: { hocId },
+          })
+        ).data
+        communityInfo.value.hocInfo = (content && content[0]) || {}
+        const { content: memberList } = (
+          await ajax.get({
+            url: api.GET_HOC_MEMBER,
+            params: { hocId },
+          })
+        ).data
+        communityInfo.value.hocInfo.memberList = memberList || []
+      } else {
+        communityInfo.value.hocInfo = {}
+      }
+      const cspId = communityInfo.value && communityInfo.value.cspId
+      if (cspId) {
+        const content = await searchCompany(cspId)
+        propertyInfo.value = content && content[0]
+      } else {
+        propertyInfo.value = {}
       }
+      communityInfo.value.buildingList =
+        (await searchBuilding({ sectId: data.sectId })) || []
+      communityModal.value = true
+      populationModal.value = false
+      caseModal.value = false
     }
     return {
       searchType,

src/view/components/tabs.vue

@@ -87,7 +87,7 @@ export default defineComponent({
       color $edge
       font-size .09rem
       opacity 0.6
-      transition all .2s ease
+      transition all .1s ease
       &.on
       &:hover
         color #fff