公共管理接口对接完成

src/ajax/api.ts

@@ -57,7 +57,7 @@ export default {
   GET_TODAYCASE: '/service-special-nandong/compair/willTouch', //  有求必应-今日案件数
   GET_STAGECASE: '/service-special-nandong/compair/willTouch/status', // 有求必应-各阶段案件数
   GET_WORKSTATION: '/service-special-nandong/compair/willTouch/workStation', // 有求必应-工作站分类
-  GET_TRACKEVENT: '/api/service-special-nandong/compairs', // 有求必应-事件跟踪
+  GET_TRACKEVENT: '/service-special-nandong/compairs', // 有求必应-事件跟踪
   GET_CASE_CLASSIFICATION_RANK: '/service-special-nandong/compair/analysis', // 案件分析-分类排行
-  GET_ADDR: '/service-special-nandong/compair/analysis/addr', // 案件分析-多发地点
+  GET_MOREHAPPEN_ADDR: '/service-special-nandong/compair/analysis/addr', // 案件分析-多发地点
 }

src/store/actions.ts

@@ -8,6 +8,7 @@ export default {
   initData({ dispatch }: { dispatch: Dispatch }): void {
     dispatch('getPropertySummary')
     dispatch('getCaseList')
+    // dispatch('GET_TODAYCASE')
   },
   // 物业三架马车数据 （缺交叉任职数）
   async getPropertySummary({ commit }: { commit: Commit }): Promise<void> {
@@ -456,7 +457,127 @@ export default {
         params,
       })
     ).data
-    console.log(content, '有诉必答 - 紧急案件')
+    // console.log(content, '有诉必答 - 紧急案件')
     commit('SET_URGENTCASE', content)
   },
+  async GET_TODAYCASE(
+    {
+      commit,
+    }: {
+      commit: Commit
+    },
+    params: {
+      [key: string]: string
+    }
+  ): Promise<void> {
+    // 有求必应 - 今日案件数
+    const { content } = (
+      await ajax.get({
+        url: api.GET_TODAYCASE,
+        params,
+      })
+    ).data
+    // console.log(content, '有求必应 - 今日案件数')
+    commit('SET_TODAYCASE', content)
+  },
+  async GET_STAGECASE(
+    {
+      commit,
+    }: {
+      commit: Commit
+    },
+    params: {
+      [key: string]: string
+    }
+  ): Promise<void> {
+    // 有求必应 - 各阶段案件数
+    const { content } = (
+      await ajax.get({
+        url: api.GET_STAGECASE,
+        params,
+      })
+    ).data
+    // console.log(content, '有求必应 - 各阶段案件数')
+    commit('SET_STAGECASE', content)
+  },
+  async GET_WORKSTATION(
+    {
+      commit,
+    }: {
+      commit: Commit
+    },
+    params: {
+      [key: string]: string
+    }
+  ): Promise<void> {
+    // 有求必应 - 工作站分类
+    const { content } = (
+      await ajax.get({
+        url: api.GET_WORKSTATION,
+        params,
+      })
+    ).data
+    // console.log(content, '有求必应 - 工作站分类')
+    commit('SET_WORKSTATION', content)
+  },
+  async GET_TRACKEVENT(
+    {
+      commit,
+    }: {
+      commit: Commit
+    },
+    params: {
+      [key: string]: string
+    }
+  ): Promise<void> {
+    // 有求必应 - 事件跟踪
+    const { content } = (
+      await ajax.get({
+        url: api.GET_TRACKEVENT,
+        params,
+      })
+    ).data
+    // console.log(content, '有求必应 - 事件跟踪')
+    commit('SET_TRACKEVENT', content)
+  },
+  async GET_CASE_CLASSIFICATION_RANK(
+    {
+      commit,
+    }: {
+      commit: Commit
+    },
+    params: {
+      [key: string]: string
+    }
+  ): Promise<void> {
+    // 案件分析 - 分类排行
+    const { content } = (
+      await ajax.get({
+        url: api.GET_CASE_CLASSIFICATION_RANK,
+        params,
+      })
+    ).data
+    console.log(content, '案件分析 - 分类排行')
+    commit('SET_CASE_CLASSIFICATION_RANK', content)
+  },
+  async GET_MOREHAPPEN_ADDR(
+    {
+      commit,
+    }: {
+      commit: Commit
+    },
+    params: {
+      [key: string]: string
+    }
+  ): Promise<void> {
+    // 案件分析 - 多发地点
+    const { content } = (
+      await ajax.get({
+        url: api.GET_MOREHAPPEN_ADDR,
+        params,
+      })
+    ).data
+    console.log(content, '案件分析 - 多发地点')
+    commit('SET_MOREHAPPEN_ADDR', content)
+  },
 }

src/store/index.ts

@@ -104,6 +104,12 @@ export interface GlobalStateProps {
   yousubidaRank: Partial<YousubidaRankProp>
   classificationRank: any[]
   urgentCase: any[]
+  todayCase: { [key: string]: number }
+  stageCase: { [key: string]: number }
+  workstationKind: { [key: string]: number }
+  trackEvent: any[]
+  analysisRank: Partial<DutyDataProp>
+  moreHappenAddr: Partial<DutyDataProp>
 }
 export default createStore<GlobalStateProps>({
   state,

src/store/mutations.ts

@@ -198,4 +198,40 @@ export default {
   SET_URGENTCASE(state: GlobalStateProps, data: unknown[]): void {
     state.urgentCase = data
   },
+  // 有求必应-今日案件数
+  SET_TODAYCASE(
+    state: GlobalStateProps,
+    data: { [key: string]: number }
+  ): void {
+    state.todayCase = data
+  },
+  // 有求必应-各阶段案件数
+  SET_STAGECASE(
+    state: GlobalStateProps,
+    data: { [key: string]: number }
+  ): void {
+    state.stageCase = data
+  },
+  // 有求必应-工作站分类
+  SET_WORKSTATION(
+    state: GlobalStateProps,
+    data: { [key: string]: number }
+  ): void {
+    state.workstationKind = data
+  },
+  // 有求必应-事件跟踪
+  SET_TRACKEVENT(state: GlobalStateProps, data: unknown[]): void {
+    state.trackEvent = data
+  },
+  // 有求必应-分类排行
+  SET_CASE_CLASSIFICATION_RANK(
+    state: GlobalStateProps,
+    data: DutyDataProp
+  ): void {
+    state.analysisRank = data
+  },
+  // 有求必应-多发地点
+  SET_MOREHAPPEN_ADDR(state: GlobalStateProps, data: DutyDataProp): void {
+    state.moreHappenAddr = data
+  },
 }

src/store/state.ts

@@ -46,4 +46,10 @@ export default {
   yousubidaRank: {},
   classificationRank: [],
   urgentCase: [],
+  todayCase: {},
+  stageCase: {},
+  workstationKind: {},
+  trackEvent: [],
+  analysisRank: { day: [], week: [], month: [] },
+  moreHappenAddr: { day: [], week: [], month: [] },
 } as GlobalStateProps

src/view/components/brief.vue

@@ -58,10 +58,11 @@ export default defineComponent({
 .brief-container
   display flex
   align-items center
+  white-space nowrap
   .count
-    font-size .12rem
+    font-size .11rem
     &.yellow
-      font-size .14rem
+      font-size .13rem
       color $yellow
   >div
     display flex

src/view/right/case-analysis.vue

@@ -2,29 +2,32 @@
   <m-card title="案件分析">
     <div class="nav">
       <div>
-        <Tabs :list="tabs" horizontal />
+        <Tabs :list="tabs" horizontal @select="curTab = $event" />
       </div>
       <div>
         <span
           v-for="option in options"
-          :key="option"
-          :class="{ on: curOption === option }"
-          @click="curOption = option"
+          :key="option.key"
+          :class="{ on: curOption === option.key }"
+          @click="curOption = option.key"
         >
-          {{ option }}
+          {{ option.name }}
         </span>
       </div>
     </div>
     <div class="rank">
       <SubTitle>分类排行</SubTitle>
-      <div class="content">
-        <m-progress
-          v-for="rank in rankList"
-          :key="rank.name"
-          :value="rank.value"
-          :msg="rank"
-        />
+      <div v-if="rankList.length > 0" class="content">
+        <m-scroll :length="rankList.length" :limit="4">
+          <m-progress
+            v-for="rank in rankList"
+            :key="rank.name"
+            :value="rank.rate"
+            :msg="rank"
+          />
+        </m-scroll>
       </div>
+      <m-empty v-else />
     </div>
     <div class="place">
       <SubTitle>多发地点</SubTitle>
@@ -38,44 +41,98 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref, computed, watch } from 'vue'
 import Tabs, { TabsProp } from '../components/tabs.vue'
 import SubTitle from '../components/sub-title.vue'
 import Place, { PlaceProp } from '../components/place.vue'
-
+import store from '@/store'
 export default defineComponent({
   name: 'CaseAnalysis',
   components: { Tabs, SubTitle, Place },
   setup() {
+    const todayCase = computed(() => store.state.todayCase)
+
+    const curTab = ref('综合')
     const tabs = ref<TabsProp[]>([
-      {
-        key: 'all',
-        name: '综合管理',
-      },
-      {
-        key: 'street',
-        name: '街面管理',
-      },
-      {
-        key: 'community',
-        name: '小区管理',
-      },
+      { name: '综合管理', key: '综合' },
+      { name: '街面管理', key: '街面' },
+      { name: '小区管理', key: '小区' },
     ])
-    const options = ref(['日', '周', '月'])
-    const curOption = ref('月')
-    const rankList = ref([
-      { name: '分类1', value: 50 },
-      { name: '分类2', value: 31 },
-      { name: '分类3', value: 15 },
-    ])
-    const placeList = ref<PlaceProp[]>([
-      { name: '延安东路1292弄', value: 3, type: '路段' },
-      { name: '延安东路1293弄', value: 5, type: '小区' },
-      { name: '延安东路1294弄', value: 8, type: '商业' },
+    const options = ref([
+      { name: '日', key: 'day' },
+      { name: '周', key: 'week' },
+      { name: '月', key: 'month' },
     ])
+    const curOption = ref('month')
+
+    watch(
+      [() => curTab.value, () => curOption.value],
+      ([type, time]) => {
+        if (!time || !type) return
+
+        console.log(type)
+        console.log(time)
+
+        store.dispatch('GET_CASE_CLASSIFICATION_RANK', {
+          managementType: type,
+        })
+        store.dispatch('GET_MOREHAPPEN_ADDR', {
+          managementType: type,
+        })
+      },
+      { immediate: true }
+    )
+
+    const rankList = computed(() => {
+      const data = store.state.analysisRank[curOption.value] || []
+      const total = data.reduce((acc, cur) => acc + cur.num, 0)
+      return data.map((item: any) => ({
+        name: item.businsessType || item.businessType,
+        rate: +Math.ceil((item.num / total) * 100).toFixed(0),
+        value: item.num,
+        unit: '件',
+      }))
+    })
+
+    const placeList = computed(() => {
+      const data = store.state.moreHappenAddr[curOption.value] || []
+      return data.map((item: any) => ({
+        name: item.address,
+        value: item.num,
+        type: '路段',
+      }))
+    })
+
+    // const tabs = ref<TabsProp[]>([
+    //   {
+    //     key: 'all',
+    //     name: '综合管理',
+    //   },
+    //   {
+    //     key: 'street',
+    //     name: '街面管理',
+    //   },
+    //   {
+    //     key: 'community',
+    //     name: '小区管理',
+    //   },
+    // ])
+    // const options = ref(['日', '周', '月'])
+    // const curOption = ref('月')
+    // const rankList = ref([
+    //   { name: '分类1', value: 50 },
+    //   { name: '分类2', value: 31 },
+    //   { name: '分类3', value: 15 },
+    // ])
+    // const placeList = ref<PlaceProp[]>([
+    //   { name: '延安东路1292弄', value: 3, type: '路段' },
+    //   { name: '延安东路1293弄', value: 5, type: '小区' },
+    //   { name: '延安东路1294弄', value: 8, type: '商业' },
+    // ])
     return {
       tabs,
       options,
+      curTab,
       curOption,
       rankList,
       placeList,
@@ -91,7 +148,7 @@ export default defineComponent({
   display flex
   align-items center
   justify-content space-between
-  margin .05rem 0
+  margin 0.05rem 0
   >div
     width 75%
     &:last-child
@@ -99,20 +156,22 @@ export default defineComponent({
       display flex
       >span
         $center()
-        width .22rem
+        width 0.22rem
         height @width
         color $primary-border
-        border .01rem solid @color
+        border 0.01rem solid @color
         cursor pointer
-        &:hover
-        &.on
+        &:hover, &.on
           color $secondary-color
           border-color @color
-          background rgba(50,197,255,.2)
+          background rgba(50, 197, 255, 0.2)
 .rank
-  flex 1
+  min-height 1rem
+  .content
+    height 1rem
+    overflow hidden
 .place
-  margin .05rem 0
+  margin 0.05rem 0
   .content
     display flex
     justify-content space-between

src/view/right/complain.vue

@@ -33,21 +33,17 @@
       </div>
       <div class="emergency">
         <m-sub>紧急案件</m-sub>
-        <m-scroll :limit="1" :length="1" :step="1" mode="2">
-          <div
-            v-for="item in urgentCase.slice(0, 1)"
-            :key="item"
-            class="detail"
-          >
-            <div>
+        <m-scroll :limit="1" :length="urgentCase.length" :step="1" mode="2">
+          <div v-for="item in urgentCase" :key="item" class="detail">
+            <div class="title">
               <p>
                 {{ item.managementType }}管理 · {{ item.businsessTypeLv1 }} ·
                 {{ item.source }}
               </p>
               <span>{{ item.address }}</span>
             </div>
-            <div>
-              {{ item.reportContent }}
+            <div class="msg">
+              {{ item.reportContent || '暂无' }}
             </div>
           </div>
         </m-scroll>
@@ -61,6 +57,7 @@ import { defineComponent, ref, computed, watch } from 'vue'
 import Tabs, { TabsProp } from '../components/tabs.vue'
 import SubTitle from '../components/sub-title.vue'
 import { ECOption } from '@/components/MyComponent/MyChart/my-line.vue'
+import moment from 'moment'
 import store from '@/store'
 
 export default defineComponent({
@@ -72,15 +69,15 @@ export default defineComponent({
     store.dispatch('GET_URGENTCASE', {
       bxmaintainType: '1',
       status_in: '待派遣,已派单',
-      acceptTime_gte: '2021-04-16',
-      pageSize: 110,
+      acceptTime_gte: moment(new Date()).format('YYYY-MM-DD'),
+      pageSize: 1000,
     })
 
     const rank = computed(() => store.state.yousubidaRank)
     const classificationRank = computed(() => store.state.classificationRank)
     const urgentCase = computed(() => store.state.urgentCase)
 
-    console.log(urgentCase)
+    // console.log(urgentCase)
 
     const fontSize = computed(() => Math.floor((screen.height * 1.6) / 100))
     const showChart = computed(() => store.state.curTheme === 'manage')
@@ -253,9 +250,9 @@ export default defineComponent({
 .box
   flex-direction column
   display flex
-  height 100%
+  height 97%
 .summary
-  height 8%
+  height 5%
   display flex
   justify-content space-between
   align-items center
@@ -272,15 +269,16 @@ export default defineComponent({
       p
         color #ccc
 .manage
+  flex 1
   display flex
-  height 60%
+  // height 60%
   // margin-bottom .05rem
   .content
     flex 1
     padding-left 0.1rem
     .chart
       width 100%
-      height 40%
+      height 44%
       &.wrapper
         display flex
         >div
@@ -308,7 +306,8 @@ export default defineComponent({
               &:nth-of-type(5) > span
                 background #32C5FF
 .emergency
-  height 25%
+  height 1.2rem
+  overflow hidden
   // overflow hidden
   .detail
     display flex
@@ -316,6 +315,8 @@ export default defineComponent({
     padding 0.1rem
     background url('@/assets/images/border2.png') 100% / 100% 100% no-repeat
     margin-bottom 0.05rem
+    height 0.95rem
+    box-sizing border-box
     >div
       flex 1
       &:first-child