对接接口

src/ajax/api.ts

@@ -44,6 +44,7 @@ export default {
   GET_PUBLICSAFE_STREETPOWER: '/service-special-nandong/streetPower', // 网格工作站(原名街道力量)
   GET_PUBLICSAFE_PARTY: '/service-special-nandong/party', // 党建
   GET_PUBLICSAFE_ECONOMIC: '/service-special-nandong/economic', // 经济
+
   /** 小区屏 */
   GET_COMMUNITY_IDS: '/service-special-nandong/getSectIdList', // 获取小区id列表
   GET_COMMUNITY_INFO: '/service-special-nandong/bigscreenCommunity/statistical', // 小区档案
@@ -51,6 +52,7 @@ export default {
   GET_ISSUE_LIST: '/service-special-nandong/management/factors', // 管理要素列表
   GET_SCORE_ISSUE: '/service-special-nandong/score/elements', // 评分要素
   GET_COMBINE_LIST: '/service-special-nandong/league/linkage', // 联勤联动列表
+
   /** 报警发短信 */
   POST_ALARM: '/service-alarm-nandong/public/alarm',
 
@@ -62,6 +64,8 @@ export default {
   GET_DUTY_EVENTS: '/service-special-nandong/compair/getRanking/cmt', // 勤务分析 - 居委事件数量
   GET_DUTY_PLACES: '/service-special-nandong/compair/getRanking/addr', // 勤务分析 - 多发地点
   GET_DUTY_RANKING: '/service-special-nandong/compair/getRanking/all', // 勤务分析 - 排行
+  GET_OLD_SERVICE: '/service-special-nandong/forOld/statistics', // 便民 - 为老
+  GET_LIFE_CONVENIENT: '/service-special-nandong/convenient/statistics', // 便民 - 生活便利
 
   /** 公共管理 */
   GET_YOUSUBIDA_RANK: '/service-special-nandong/compair/willReach', // 有诉必答-占比
@@ -74,4 +78,11 @@ export default {
   GET_TRACKEVENT: '/service-special-nandong/compairs', // 有求必应-事件跟踪
   GET_CASE_CLASSIFICATION_RANK: '/service-special-nandong/compair/analysis', // 案件分析-分类排行
   GET_MOREHAPPEN_ADDR: '/service-special-nandong/compair/analysis/addr', // 案件分析-多发地点
+
+  /** 公共服务 */
+  GET_ECOLOGY_LIST: '/service-basicdatasync-ddd/nonResident/ecological', // 生态-衣食住行
+  GET_ECOLOGY_CONVENIENT: '/service-special-nandong/convenient/ecological', // 生态-便民设施
+  GET_ECOLOGY_PHOTO: '/service-special-nandong/buildingPhotos', // 生态 - 商业综合体、文保、历保照片
+  GET_ELEV_COUNT: '/service-special-nandong/elevatorAdd/statistical', // 美丽家园-电梯加装统计数字
+  GET_ELEV_LIST: '/service-special-nandong/elevatorAdds', // 美丽家园 - 根据名称查询列表
 }

src/components/MyComponent/main.styl

@@ -47,7 +47,7 @@ $font-color = #70A7E0
 $table-bg(opacity = 0.3)
   rgba(0, 118, 255, opacity )
 
-$card-bg2()
-  background rgba(70,83,97,.4)
-  box-shadow inset 0 .01rem .02rem 0 rgba(204,204,204,.2)
+$card-bg2(opacity = 0.4, shadow = 0.2)
+  background rgba(70,83,97,opacity)
+  box-shadow inset 0 .01rem .02rem 0 rgba(204,204,204,shadow)
   border-radius .03rem
\ No newline at end of file

src/store/actions.ts

 import { ajax, api } from '@/ajax'
 import { Dispatch, Commit } from 'vuex'
-import inImg from '@/assets/images/in.png'
-import china from '@/assets/images/china.png'
-import out from '@/assets/images/out.png'
+import dayjs from 'dayjs'
+
+const today = dayjs().format('YYYY-MM-DD')
 
 export default {
   initData({ dispatch }: { dispatch: Dispatch }): void {
     dispatch('getPropertySummary')
     dispatch('getCaseList')
-    // dispatch('GET_TODAYCASE')
+    dispatch('GET_PUBLICSAFE_COMMANDSYSTEM')
+    dispatch('GET_PUBLICSAFE_STREETPOWER')
+    dispatch('GET_PUBLICSAFE_PARTY')
+    dispatch('GET_PUBLICSAFE_ECONOMIC')
+    dispatch('GET_PUBLICSAFE_TRUE_COMPANY')
+    dispatch('GET_YOUSUBIDA_RANK')
+    dispatch('GET_YOUSUBIDA_CLASSIFICATION_RANK', '综合')
+    dispatch('GET_URGENTCASE', {
+      bxmaintainType: '1',
+      status_in: '待派遣,已派单',
+      acceptTime_gte: today,
+      pageSize: 1000,
+    })
+    dispatch('GET_TODAYCASE')
+    dispatch('GET_STAGECASE')
+    dispatch('GET_WORKSTATION')
+    dispatch('GET_TRACKEVENT', {
+      status_in: '待处置,已签收',
+      acceptTime_gte: today,
+      pageSize: 1000,
+    })
+    dispatch('GET_CASE_CLASSIFICATION_RANK', {
+      managementType: '综合',
+    })
+    dispatch('GET_MOREHAPPEN_ADDR', {
+      managementType: '综合',
+    })
+    dispatch('GET_PUBLICSAFE_SOS_MATERIAL')
+    dispatch('GET_PUBLICSAFE_OUTHOUSEWALL')
+    dispatch('GET_PUBLICSAFE_BUILDINGS')
+    dispatch('GET_PUBLICSAFE_PIEDATA')
+    dispatch('GET_PUBLICSAFE_HOUSE')
+    dispatch('GET_PUBLICSAFE_NONRESIDENT')
+    dispatch('GET_PUBLICSAFE_RIGHT_GATE')
+    dispatch('GET_PUBLICSAFE_RIGHT_SAFEMAP')
+    dispatch('GET_PUBLICSAFE_NEWFIND')
+    dispatch('GET_PUBLICSAFE_TRUE_PEOPLE')
+    dispatch('getEcologyList')
+    dispatch('getEcologyConvenient')
+    dispatch('getEcologyPhoto')
+    dispatch('getElevCount')
   },
   // 物业三架马车数据 （缺交叉任职数）
   async getPropertySummary({ commit }: { commit: Commit }): Promise<void> {
@@ -33,12 +73,6 @@ export default {
     commit('SET_CASE_LIST', content)
   },
 
-  // // 工作站列表
-  // async getStation({ commit }: { commit: Commit }): Promise<void> {
-  //   const { content } = (await ajax.get({ url: api.GET_STATION })).data
-  //   commit('SET_STATION_LIST', content)
-  // },
-
   // 公共服务 - 门岗值守 - 社会物业和直管公房数据
   async GET_PUBLICSAFE_NEWFIND({ commit }: { commit: Commit }): Promise<void> {
     const { content } = (
@@ -69,6 +103,7 @@ export default {
 
     commit('SET_PUBLICSAFE_NEWFIND', obj)
   },
+
   // 公共服务 - 门岗值守 - 社会物业和直管公房数据
   async GET_PUBLICSAFE_RIGHT_GATE({
     commit,
@@ -125,6 +160,7 @@ export default {
     commit('SET_PUBLICSAFE_GATESENTRY_SHEHUIWUYE', shehuiwuye)
     commit('SET_PUBLICSAFE_GATESENTRY_ZHIGUANGONGFANG', publicHouse)
   },
+
   // 公共服务 - 门岗值守 - 平安地图
   async GET_PUBLICSAFE_RIGHT_SAFEMAP({
     commit,
@@ -139,6 +175,7 @@ export default {
     ).data
     commit('SET_PUBLICSAFE_SAFEMAP', content)
   },
+
   // 公共服务 - 实有人口
   async GET_PUBLICSAFE_TRUE_PEOPLE({
     commit,
@@ -150,6 +187,7 @@ export default {
     ).data
     commit('SET_PUBLICSAFE_TRUE_PEOPLE', content)
   },
+
   // 公共服务 - 实有房屋
   async GET_PUBLICSAFE_HOUSE({ commit }: { commit: Commit }): Promise<void> {
     const { content } = (await ajax.get({ url: api.GET_PUBLICSAFE_HOUSE })).data
@@ -175,6 +213,7 @@ export default {
     commit('SET_PUBLICSAFE_HOUSE_STKIND', content.stKind)
     commit('SET_PUBLICSAFE_HOUSE_STKIND', obj)
   },
+
   // 公共服务 - 非居房屋
   async GET_PUBLICSAFE_NONRESIDENT({
     commit,
@@ -186,6 +225,7 @@ export default {
     ).data
     commit('SET_PUBLICSAFE_NONRESIDENT', content)
   },
+
   // 公共服务 - 实有单位
   async GET_PUBLICSAFE_TRUE_COMPANY({
     commit,
@@ -197,6 +237,7 @@ export default {
     ).data
     commit('SET_PUBLICSAFE_TRUE_COMPANY', content)
   },
+
   // 公共服务 - 应急物资储备
   async GET_PUBLICSAFE_SOS_MATERIAL({
     commit,
@@ -209,6 +250,7 @@ export default {
     // console.log(content)
     commit('SET_PUBLICSAFE_SOS_MATERIAL', content)
   },
+
   // 公共服务 - 房屋外立面
   async GET_PUBLICSAFE_OUTHOUSEWALL({
     commit,
@@ -218,9 +260,9 @@ export default {
     const { content } = (
       await ajax.get({ url: api.GET_PUBLICSAFE_OUTHOUSEWALL })
     ).data
-    // console.log(content, '房屋外立面')
     commit('SET_PUBLICSAFE_OUTHOUSEWALL', content)
   },
+
   // 公共服务 - 重点关注楼宇
   async GET_PUBLICSAFE_BUILDINGS({
     commit,
@@ -235,14 +277,40 @@ export default {
     ).data
     commit('SET_PUBLICSAFE_BUILDINGS', content)
   },
+
   // 公共服务 - 房屋外立面饼图
   async GET_PUBLICSAFE_PIEDATA({ commit }: { commit: Commit }): Promise<void> {
     const { content } = (
       await ajax.get({ url: api.GET_PUBLICSAFE_PIEDATA })
     ).data
-    // console.log(content, 'pie')
     commit('SET_PUBLICSAFE_PIEDATA', content)
   },
+
+  /** 公共服务 - 生态 */
+  async getEcologyList({ commit }: { commit: Commit }): Promise<void> {
+    const { content } = (await ajax.get({ url: api.GET_ECOLOGY_LIST })).data
+    commit('SET_ECOLOGY_LIST', content)
+  },
+  async getEcologyConvenient({ commit }: { commit: Commit }): Promise<void> {
+    const { content } = (
+      await ajax.get({ url: api.GET_ECOLOGY_CONVENIENT })
+    ).data
+    commit('SET_ECOLOGY_CONVENIENT', content)
+  },
+  async getEcologyPhoto({ commit }: { commit: Commit }): Promise<void> {
+    const { content } = (
+      await ajax.get({
+        url: api.GET_ECOLOGY_PHOTO,
+        params: { pageNo: 1, pageSize: 1000 },
+      })
+    ).data
+    commit('SET_ECOLOGY_PHOTO', content)
+  },
+  async getElevCount({ commit }: { commit: Commit }): Promise<void> {
+    const { content } = (await ajax.get({ url: api.GET_ELEV_COUNT })).data
+    commit('SET_ELEV_COUNT', content)
+  },
+
   // 左侧公共 - 指挥体系
   async GET_PUBLICSAFE_COMMANDSYSTEM({
     commit,
@@ -252,9 +320,9 @@ export default {
     const { content } = (
       await ajax.get({ url: api.GET_PUBLICSAFE_COMMANDSYSTEM })
     ).data
-    // console.log(content)
     commit('SET_PUBLICSAFE_COMMANDSYSTEM', content)
   },
+
   // 左侧公共 - 网格工作站
   async GET_PUBLICSAFE_STREETPOWER({
     commit,
@@ -264,21 +332,20 @@ export default {
     const { content } = (
       await ajax.get({ url: api.GET_PUBLICSAFE_STREETPOWER })
     ).data
-    // console.log(content, '网格工作站)')
     commit('SET_PUBLICSAFE_STREETPOWER', content.workStation || [])
   },
+
   // 左侧公共 - 党建
   async GET_PUBLICSAFE_PARTY({ commit }: { commit: Commit }): Promise<void> {
     const { content } = (await ajax.get({ url: api.GET_PUBLICSAFE_PARTY })).data
-    // console.log(content, '党建')
     commit('SET_PUBLICSAFE_PARTY', content)
   },
+
   // 左侧公共 - 经济
   async GET_PUBLICSAFE_ECONOMIC({ commit }: { commit: Commit }): Promise<void> {
     const { content } = (
       await ajax.get({ url: api.GET_PUBLICSAFE_ECONOMIC })
     ).data
-    // console.log(content, '经济')
     commit('SET_PUBLICSAFE_ECONOMIC', content)
   },
 
@@ -339,11 +406,14 @@ export default {
     ).data
     commit('SET_COMBINE_DATA', content)
   },
+
   /** 工作站 */
   initStationData({ dispatch }: { dispatch: Dispatch }, id: string): void {
     if (!id) return
     dispatch('getStationById', id)
     dispatch('getDutySum', id)
+    dispatch('getOldService', id)
+    dispatch('getLifeConvenient', id)
   },
   async getStationById(
     { commit }: { commit: Commit },
@@ -428,11 +498,39 @@ export default {
     ).data
     commit('SET_DUTY_RANKING', content)
   },
+  async getOldService(
+    { commit }: { commit: Commit },
+    id: string
+  ): Promise<void> {
+    const { content } = (
+      await ajax.get({
+        url: api.GET_OLD_SERVICE,
+        params: {
+          workstationId: id,
+        },
+      })
+    ).data
+    commit('SET_OLD_SERVICE', content)
+  },
+  async getLifeConvenient(
+    { commit }: { commit: Commit },
+    id: string
+  ): Promise<void> {
+    const { content } = (
+      await ajax.get({
+        url: api.GET_LIFE_CONVENIENT,
+        params: {
+          workstationId: id,
+        },
+      })
+    ).data
+    commit('SET_LIFE_CONVENIENT', content)
+  },
+
   /** 公共管理 */
   async GET_YOUSUBIDA_RANK({ commit }: { commit: Commit }): Promise<void> {
     // 有诉必答 - 占比
     const { content } = (await ajax.get({ url: api.GET_YOUSUBIDA_RANK })).data
-    // console.log(content, '有诉必答 - 占比')
     commit('SET_YOUSUBIDA_RANK', content)
   },
   async GET_YOUSUBIDA_CLASSIFICATION_RANK(
@@ -450,7 +548,6 @@ export default {
         params: { managementType: managementType },
       })
     ).data
-    // console.log(content, '有诉必答 - 分类排行')
     commit('SET_YOUSUBIDA_CLASSIFICATION_RANK', content)
   },
   async GET_URGENTCASE(
@@ -470,7 +567,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '有诉必答 - 紧急案件')
     commit('SET_URGENTCASE', content)
   },
   async GET_TODAYCASE(
@@ -490,7 +586,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '有求必应 - 今日案件数')
     commit('SET_TODAYCASE', content)
   },
   async GET_STAGECASE(
@@ -510,7 +605,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '有求必应 - 各阶段案件数')
     commit('SET_STAGECASE', content)
   },
   async GET_WORKSTATION(
@@ -530,7 +624,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '有求必应 - 工作站分类')
     commit('SET_WORKSTATION', content)
     commit('SET_WORKSTATION_PIEDATA', content[0].statistical)
   },
@@ -551,7 +644,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '有求必应 - 事件跟踪')
     commit('SET_TRACKEVENT', content)
   },
   async GET_CASE_CLASSIFICATION_RANK(
@@ -571,7 +663,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '案件分析 - 分类排行')
     commit('SET_CASE_CLASSIFICATION_RANK', content)
   },
   async GET_MOREHAPPEN_ADDR(
@@ -591,7 +682,6 @@ export default {
         params,
       })
     ).data
-    // console.log(content, '案件分析 - 多发地点')
     commit('SET_MOREHAPPEN_ADDR', content)
   },
 }

src/store/index.ts

@@ -60,6 +60,28 @@ export interface DutyDataProp {
   [key: string]: { [key: string]: any }[]
 }
 
+export interface EcologyListProp {
+  labelName: string
+  num: number
+}
+
+export interface EcologyPhotoProp {
+  buildingName: string
+  buildingType: string
+  id: string
+  photoUrl?: string
+}
+
+export interface ForOldProp {
+  facilitiesType: string
+  num: number
+}
+
+export interface ElevCountProp {
+  cmtName: string
+  num: number
+}
+
 export interface GlobalStateProps {
   showLoading: boolean
   curView: ViewType
@@ -119,6 +141,12 @@ export interface GlobalStateProps {
   trackEvent: any[]
   analysisRank: Partial<DutyDataProp>
   moreHappenAddr: Partial<DutyDataProp>
+  ecologyList: EcologyListProp[]
+  ecologyConvenient: EcologyListProp[]
+  ecologyPhoto: EcologyPhotoProp[]
+  oldService: ForOldProp[]
+  lifeConvenient: EcologyListProp[]
+  elevCount: ElevCountProp[]
 }
 
 export default createStore<GlobalStateProps>({

src/store/mutations.ts

@@ -8,6 +8,10 @@ import {
   DutySumProp,
   DutyDataProp,
   YousubidaRankProp,
+  EcologyListProp,
+  EcologyPhotoProp,
+  ForOldProp,
+  ElevCountProp,
 } from './index'
 
 export default {
@@ -191,6 +195,13 @@ export default {
   SET_DUTY_RANKING(state: GlobalStateProps, data: DutyDataProp): void {
     state.dutyRanking = data
   },
+  SET_OLD_SERVICE(state: GlobalStateProps, data: ForOldProp[]): void {
+    state.oldService = data
+  },
+  SET_LIFE_CONVENIENT(state: GlobalStateProps, data: EcologyListProp[]): void {
+    state.lifeConvenient = data
+  },
+
   /** 公共管理 */
   // 有诉必答-占比
   SET_YOUSUBIDA_RANK(state: GlobalStateProps, data: YousubidaRankProp): void {
@@ -246,4 +257,23 @@ export default {
   SET_MOREHAPPEN_ADDR(state: GlobalStateProps, data: DutyDataProp): void {
     state.moreHappenAddr = data
   },
+
+  /** 公共服务 - 生态 */
+  SET_ECOLOGY_LIST(state: GlobalStateProps, data: EcologyListProp[]): void {
+    state.ecologyList = data
+  },
+  SET_ECOLOGY_CONVENIENT(
+    state: GlobalStateProps,
+    data: EcologyListProp[]
+  ): void {
+    state.ecologyConvenient = data
+  },
+  SET_ECOLOGY_PHOTO(state: GlobalStateProps, data: EcologyPhotoProp[]): void {
+    state.ecologyPhoto = data
+  },
+
+  /** 美丽家园-电梯 */
+  SET_ELEV_COUNT(state: GlobalStateProps, data: ElevCountProp[]): void {
+    state.elevCount = data
+  },
 }

src/store/state.ts

@@ -219,4 +219,10 @@ export default {
   trackEvent: [],
   analysisRank: { day: [], week: [], month: [] },
   moreHappenAddr: { day: [], week: [], month: [] },
+  ecologyList: [],
+  ecologyConvenient: [],
+  ecologyPhoto: [],
+  oldService: [],
+  lifeConvenient: [],
+  elevCount: [],
 } as GlobalStateProps

src/view/left/command.vue

@@ -134,12 +134,6 @@ export default defineComponent({
         },
       ]
     })
-
-    store.dispatch('GET_PUBLICSAFE_COMMANDSYSTEM')
-    store.dispatch('GET_PUBLICSAFE_STREETPOWER')
-    store.dispatch('GET_PUBLICSAFE_PARTY')
-    store.dispatch('GET_PUBLICSAFE_ECONOMIC')
-
     const commandSystem = computed(() => store.state.pubulicLeftCommandSystem)
     const streetPower = computed(() => store.state.pubulicLeftStreetPower)
     const party = computed(() => store.state.pubulicLeftParty)

src/view/right/beauty-home-in-station.vue

 <template>
   <m-card title="美丽家园" mode="4">
+    <div class="container">
       <m-sub2>项目实施情况</m-sub2>
       <div class="summary">
         <div v-for="item in summary" :key="item.name">
@@ -27,6 +28,7 @@
         :color="['rgba(253,211,116,.15)', '#F7933E']"
         :msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }"
       />
+    </div>
   </m-card>
 </template>
 
@@ -124,6 +126,11 @@ export default defineComponent({
 
 <style lang="stylus" scoped>
 @import '../../components/MyComponent/main.styl'
+.container
+  height 100%
+  display flex
+  flex-direction column
+  justify-content space-around
 .summary
   width 100%
   display flex

src/view/right/beauty-home.vue

 <template>
   <m-card title="美丽家园">
+    <div class="container">
       <m-sub2>项目实施情况</m-sub2>
       <div class="summary">
         <div v-for="item in summary" :key="item.name">
@@ -8,17 +9,16 @@
         </div>
       </div>
       <Brief :list="situation" color="#fff" />
-    <!-- <div v-if="curViewType !== 'street'" class="sum-card work-station">
-      <div v-for="item in workStationProjects" :key="item.name">
-        <m-count class="count orange-count" :value="item.value" />
-        <p>{{ item.name }}</p>
-      </div>
-    </div> -->
       <m-sub2 :addition="{ value: 33, unit: '幢' }">电梯加装（排摸）</m-sub2>
-    <div v-if="curViewType === 'street'" class="sum-card">
-      <div v-for="item in elevList" :key="item.name">
-        <p>{{ item.name }}</p>
-        <m-count class="count" :value="item.value" />
+      <div class="sum-card">
+        <div
+          v-for="item in elevList"
+          :key="item.cmtName"
+          :class="{ on: curCmtName === item.cmtName }"
+          @click="handleSelect(item.cmtName)"
+        >
+          <p>{{ item.cmtName }}</p>
+          <m-count class="count" :value="item.num" />
         </div>
       </div>
       <m-sub2>马桶改造</m-sub2>
@@ -28,6 +28,7 @@
         :color="['rgba(253,211,116,.15)', '#F7933E']"
         :msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }"
       />
+    </div>
   </m-card>
 </template>
 
@@ -41,12 +42,12 @@ import icon33 from '@/assets/images/icon33.png'
 import icon34 from '@/assets/images/icon34.png'
 import icon35 from '@/assets/images/icon35.png'
 import icon36 from '@/assets/images/icon36.png'
+import { ajax, api } from '@/ajax'
 
 export default defineComponent({
   name: 'BeautyHome',
   components: { Brief },
   setup() {
-    const curViewType = computed(() => store.state.curView.type)
     const summary = ref([
       { name: '2020年', value: 26 },
       { name: '2019年', value: 24 },
@@ -58,15 +59,20 @@ export default defineComponent({
       { name: '充电桩', value: 64, icon: icon33 },
       { name: '雨污混接', value: 18, icon: icon34 },
     ])
-    const elevList = ref([
-      { name: '振兴', value: 9 },
-      { name: '福海', value: 5 },
-      { name: '江阴', value: 7 },
-      { name: '定兴', value: 1 },
-      { name: '新昌', value: 5 },
-      { name: '小花园', value: 5 },
-      { name: '顺天村', value: 1 },
-    ])
+    const elevList = computed(() => store.state.elevCount)
+    const curCmtName = ref<string | null>(null)
+    const handleSelect = async (name: string) => {
+      curCmtName.value === name
+        ? (curCmtName.value = null)
+        : (curCmtName.value = name)
+      if (!curCmtName.value) return
+
+      const { content } = (
+        await ajax.get({ url: api.GET_ELEV_LIST, params: { cmtName: name } })
+      ).data
+      // TODO 可能要出列表或者地图撒点之类的
+      console.log(`美丽街区-加装电梯-${name}区域电梯列表`, content)
+    }
     const toiletSituation = ref<BriefProp[]>([
       { name: '已完成改造', value: 26, icon: icon35 },
       { name: '应改造', value: 64, icon: icon36 },
@@ -79,10 +85,11 @@ export default defineComponent({
       { name: '公共设置', value: 8 },
     ])
     return {
-      curViewType,
       summary,
       situation,
       elevList,
+      curCmtName,
+      handleSelect,
       toiletSituation,
       workStationProjects,
     }
@@ -92,6 +99,11 @@ export default defineComponent({
 
 <style lang="stylus" scoped>
 @import '../../components/MyComponent/main.styl'
+.container
+  height 100%
+  display flex
+  flex-direction column
+  justify-content space-around
 .summary
   width 100%
   display flex
@@ -112,10 +124,6 @@ export default defineComponent({
   display flex
   flex-wrap wrap
   justify-content space-between
-  &.work-station
-    margin .05rem 0
-    >div
-      width 20%
   >div
     display flex
     justify-content space-between
@@ -124,6 +132,11 @@ export default defineComponent({
     $card-bg2()
     padding 0 .1rem
     margin-bottom .05rem
+    cursor pointer
+    transition all .3s ease
+    &:hover
+    &.on
+      $card-bg2(0.8, 0.4)
     .count
       font-size .12rem
       font-weight bold

src/view/right/case-analysis.vue

@@ -41,7 +41,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, computed, watch } from 'vue'
+import { defineComponent, ref, computed } from 'vue'
 import store from '@/store'
 export default defineComponent({
   name: 'CaseAnalysis',
@@ -54,20 +54,6 @@ export default defineComponent({
     ])
     const curOption = ref('month')
 
-    watch(
-      () => curOption.value,
-      (time) => {
-        if (!time) return
-        store.dispatch('GET_CASE_CLASSIFICATION_RANK', {
-          managementType: '综合',
-        })
-        store.dispatch('GET_MOREHAPPEN_ADDR', {
-          managementType: '综合',
-        })
-      },
-      { immediate: true }
-    )
-
     const rankList = computed(() => {
       const data = store.state.analysisRank[curOption.value] || []
       const total = data.reduce((acc, cur) => acc + cur.num, 0)

src/view/right/company.vue

@@ -31,7 +31,6 @@ import store from '@/store'
 export default defineComponent({
   name: 'Company',
   setup() {
-    store.dispatch('GET_PUBLICSAFE_TRUE_COMPANY')
     const trueCompany = computed(() => store.state.pubulicSafeTrueCompany)
 
     const showChart = computed(() => store.state.curTheme === 'safety')

src/view/right/complain.vue

@@ -66,22 +66,12 @@
 
 <script lang="ts">
 import { defineComponent, ref, computed, watch } from 'vue'
-import moment from 'moment'
 import { ChartTypes } from '@/components/MyComponent'
 import store from '@/store'
 
 export default defineComponent({
   name: 'Complain',
   setup() {
-    store.dispatch('GET_YOUSUBIDA_RANK')
-    store.dispatch('GET_YOUSUBIDA_CLASSIFICATION_RANK', '综合')
-    store.dispatch('GET_URGENTCASE', {
-      bxmaintainType: '1',
-      status_in: '待派遣,已派单',
-      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)

src/view/right/convenient.vue

@@ -3,9 +3,9 @@
     <div>
       <m-sub2>为老服务</m-sub2>
       <div class="old">
-        <div v-for="item in forOld" :key="item.name">
-          <p>{{ item.name }}</p>
-          <m-count class="count" :value="item.value" />
+        <div v-for="item in forOld" :key="item.facilitiesType">
+          <p>{{ item.facilitiesType }}</p>
+          <m-count class="count" :value="item.num" />
         </div>
       </div>
     </div>
@@ -17,34 +17,49 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue'
-import Brief, { BriefProp } from '../components/brief.vue'
+import { computed, defineComponent } from 'vue'
+import Brief from '../components/brief.vue'
 import icon27 from '@/assets/images/icon27.png'
 import icon28 from '@/assets/images/icon28.png'
 import icon29 from '@/assets/images/icon29.png'
 import icon30 from '@/assets/images/icon30.png'
+import img3 from '@/assets/images/img3.png'
+import store from '@/store'
 
 export default defineComponent({
   name: 'Convenient',
   components: { Brief },
   setup() {
-    const forOld = ref([
-      { name: '综合为老服务', value: 26 },
-      { name: '长者照护之家', value: 64 },
-      { name: '睦邻中心', value: 331 },
-      { name: '日托所', value: 157 },
-      { name: '洗衣房', value: 91 },
-      { name: '敬老院', value: 53 },
-      { name: '老年活动室', value: 38 },
-      { name: '助餐点', value: 87 },
-      { name: '助浴点', value: 68 },
-    ])
-    const forLive = ref<BriefProp[]>([
-      { name: '菜场', value: 26, icon: icon27 },
-      { name: '街面废物箱', value: 64, icon: icon28 },
-      { name: '公厕', value: 18, icon: icon29 },
-      { name: '电话亭', value: 12, icon: icon30 },
-    ])
+    const forOld = computed(() => store.state.oldService)
+    const convenientList = computed(() => store.state.lifeConvenient)
+    function getNum(name: string): number {
+      const result = convenientList.value.find((e) => e.labelName === name)
+      return (result && result.num) || 0
+    }
+    const forLive = computed(() => {
+      return [
+        {
+          name: '菜场',
+          value: getNum('菜场'),
+          icon: icon27,
+        },
+        {
+          name: '便利店',
+          value: getNum('便利店'),
+          icon: img3,
+        },
+        {
+          name: '公厕',
+          value: getNum('公厕'),
+          icon: icon29,
+        },
+        {
+          name: '药房',
+          value: getNum('药房'),
+          icon: icon30,
+        },
+      ]
+    })
     return {
       forOld,
       forLive,

src/view/right/demand.vue

@@ -66,21 +66,11 @@
 import { computed, defineComponent, ref } from 'vue'
 import Brief from '../components/brief.vue'
 import store from '@/store'
-import moment from 'moment'
 
 export default defineComponent({
   name: 'Demand',
   components: { Brief },
   setup() {
-    store.dispatch('GET_TODAYCASE')
-    store.dispatch('GET_STAGECASE')
-    store.dispatch('GET_WORKSTATION')
-    store.dispatch('GET_TRACKEVENT', {
-      status_in: '待处置,已签收',
-      acceptTime_gte: moment(new Date()).format('YYYY-MM-DD'),
-      pageSize: 1000,
-    })
-
     const todayCase = computed(() => store.state.todayCase)
     const stageCase = computed(() => store.state.stageCase)
     const workstationKind = computed(() => store.state.workstationKind)

src/view/right/ecology.vue

 <template>
   <m-card title="生态">
     <div class="detail">
-      <div v-for="item in ecologyList" :key="item.name">
-        <m-count class="count orange-count" :value="item.value" />
-        <p>{{ item.name }}</p>
+      <div v-for="item in ecologyList" :key="item.labelName">
+        <m-count class="count orange-count" :value="item.num" />
+        <p>{{ item.labelName }}</p>
       </div>
     </div>
     <m-sub2>便民设施</m-sub2>
@@ -18,27 +18,71 @@
     </div>
     <div>
       <m-sub2>商业综合体</m-sub2>
-      <div class="business photos">
+      <div class="business">
         <img v-for="photo in businessPhotos" :key="photo" :src="photo" />
       </div>
     </div>
     <div>
       <m-sub2>历保</m-sub2>
       <div class="history photos">
-        <img v-for="photo in historyPhotos" :key="photo" :src="photo" />
+        <m-scroll
+          v-if="photos1 && photos1.length > 0"
+          :length="Math.ceil(photos1.length / 3)"
+          mode="2"
+          :step="0.76"
+          :limit="2"
+        >
+          <div
+            v-for="(_, index) in Math.ceil(photos1.length / 3)"
+            :key="index"
+            class="wrapper"
+          >
+            <div
+              v-for="photo in photos1.slice(index * 3, index * 3 + 3)"
+              :key="photo.id"
+              :name="`${index * 3}, ${index * 3 + 3}`"
+              class="photo"
+              :style="`background-image:url('${photo.photoUrl}')`"
+            >
+              <p :title="photo.buildingName">{{ photo.buildingName }}</p>
+            </div>
+          </div>
+        </m-scroll>
       </div>
     </div>
     <div>
       <m-sub2>文保</m-sub2>
       <div class="history photos">
-        <img v-for="photo in historyPhotos" :key="photo" :src="photo" />
+        <m-scroll
+          v-if="photos2 && photos2.length > 0"
+          :length="Math.ceil(photos2.length / 3)"
+          mode="2"
+          :step="0.76"
+          :limit="2"
+        >
+          <div
+            v-for="(_, index) in Math.ceil(photos2.length / 3)"
+            :key="index"
+            class="wrapper"
+          >
+            <div
+              v-for="photo in photos2.slice(index * 3, index * 3 + 3)"
+              :key="photo.id"
+              :name="`${index * 3}, ${index * 3 + 3}`"
+              class="photo"
+              :style="`background-image:url('${photo.photoUrl}')`"
+            >
+              <p :title="photo.buildingName">{{ photo.buildingName }}</p>
+            </div>
+          </div>
+        </m-scroll>
       </div>
     </div>
   </m-card>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref, computed } from 'vue'
 import img1 from '@/assets/images/img1.png'
 import img2 from '@/assets/images/img2.png'
 import img3 from '@/assets/images/img3.png'
@@ -49,36 +93,53 @@ import img7 from '@/assets/images/img7.png'
 import img8 from '@/assets/images/img8.png'
 import photo1 from '@/assets/images/photo1.png'
 import photo2 from '@/assets/images/photo2.png'
-import photo3 from '@/assets/images/photo3.png'
-import photo4 from '@/assets/images/photo4.png'
-import photo5 from '@/assets/images/photo5.png'
+import store from '@/store'
 
 export default defineComponent({
   name: 'Ecology',
   setup() {
-    const ecologyList = ref([
-      { name: '衣', value: 853 },
-      { name: '行', value: 1276 },
-      { name: '食', value: 1276 },
-      { name: '住', value: 853 },
-    ])
-    const sumList = ref([
-      { name: '为老设施', value: 853, icon: img1 },
-      { name: '便民商店', value: 1276, icon: img2 },
-      { name: '便利店', value: 285, icon: img3 },
-      { name: '电话亭', value: 853, icon: img4 },
-      { name: '餐车', value: 1276, icon: img5 },
-      { name: '街面废物箱', value: 285, icon: img6 },
-      { name: '公厕', value: 200, icon: img7 },
-      { name: '垃圾箱房', value: 1957, icon: img8 },
-    ])
+    const ecologyList = computed(() => store.state.ecologyList)
+    const sumList = computed(() => {
+      return store.state.ecologyConvenient.map((item) => {
+        return {
+          name: item.labelName,
+          value: item.num,
+          icon: whichIcon(item.labelName),
+        }
+      })
+    })
+    function whichIcon(name: string): string {
+      switch (name) {
+        case '便利店':
+          return img3
+        case '公厕':
+          return img7
+        case '药房':
+          return img8
+        case '菜场':
+          return img5
+        case '菜店':
+          return img2
+        case '为老设施':
+          return img1
+        default:
+          return img3
+      }
+    }
     const businessPhotos = ref([photo1, photo2])
-    const historyPhotos = ref([photo3, photo4, photo5])
+    const photosList = computed(() => store.state.ecologyPhoto)
+    const photos1 = computed(() =>
+      photosList.value.filter((e) => e.buildingType.includes('历保'))
+    )
+    const photos2 = computed(() =>
+      photosList.value.filter((e) => e.buildingType.includes('文保'))
+    )
     return {
       ecologyList,
       sumList,
       businessPhotos,
-      historyPhotos,
+      photos1,
+      photos2,
     }
   },
 })
@@ -90,10 +151,10 @@ export default defineComponent({
   display flex
   width 100%
   justify-content space-around
+  flex-wrap wrap
   >div
-    display flex
-    justify-content space-around
-    align-items center
+    $center()
+    width 25%
   .count
     font-size .14rem
     font-family $font-barlow
@@ -116,11 +177,39 @@ export default defineComponent({
     p
       color #ccc
 .photos
+  height .76rem
+  margin-bottom .02rem
+  overflow hidden
+  .wrapper
+    width 100%
     display flex
     justify-content space-between
-  >img
-    width 30%
-  &.business
+    flex-wrap wrap
+  .photo
+    width 31%
+    height .76rem
+    position relative
+    background-repeat no-repeat
+    background-size cover
+    background-position center
+    >p
+      position absolute
+      left 0
+      right 0
+      bottom 0
+      height .2rem
+      line-height @height
+      background rgba(0,0,0,0.6)
+      text-align center
+      overflow hidden
+      white-space nowrap
+      text-overflow ellipsis
+      padding 0 .04rem
+      box-sizing border-box
+.business
+  display flex
+  justify-content space-between
+  margin-bottom .02rem
   >img
     width 48%
 </style>

src/view/right/emergency-store.vue

@@ -104,11 +104,6 @@ export default defineComponent({
   components: { Summary },
   setup() {
     const showChart = computed(() => store.state.curTheme === 'safety')
-    store.dispatch('GET_PUBLICSAFE_SOS_MATERIAL')
-    store.dispatch('GET_PUBLICSAFE_OUTHOUSEWALL')
-    store.dispatch('GET_PUBLICSAFE_BUILDINGS')
-    store.dispatch('GET_PUBLICSAFE_PIEDATA')
-
     const listModal = ref(false)
     const SOSMaterail = computed(() => store.state.pubulicSafeSOSMaterail)
     const pieData = computed(() => store.state.pubulicSafePieData)

src/view/right/house.vue

@@ -60,8 +60,6 @@ export default defineComponent({
   name: 'House',
   components: { Brief },
   setup() {
-    store.dispatch('GET_PUBLICSAFE_HOUSE')
-    store.dispatch('GET_PUBLICSAFE_NONRESIDENT')
     const pubulicSafeHouse = computed(() => store.state.pubulicSafeHouse)
     const pubulicSafeNonResident = computed(
       () => store.state.pubulicSafeNonResident

src/view/right/police.vue

@@ -79,9 +79,6 @@ export default defineComponent({
   name: 'Police',
   components: { Brief, Summary },
   setup() {
-    store.dispatch('GET_PUBLICSAFE_RIGHT_GATE')
-    store.dispatch('GET_PUBLICSAFE_RIGHT_SAFEMAP')
-    store.dispatch('GET_PUBLICSAFE_NEWFIND')
     const newFind = computed(() => store.state.pubulicSafeNewFindNum)
     const searchModal = ref(false)
     const showChart = computed(() => store.state.curTheme === 'safety')

src/view/right/population.vue

@@ -26,7 +26,6 @@ export default defineComponent({
   name: 'Population',
   components: { Brief },
   setup() {
-    store.dispatch('GET_PUBLICSAFE_TRUE_PEOPLE')
     const truePeople = computed(() => store.state.pubulicSafeTruePeople)
 
     const summary = computed(() => {

src/view/right/public-work.vue

@@ -63,6 +63,7 @@ export default defineComponent({
 // .duty,
 // .analysis
 //   flex: 1
+.beauty,
 .entry,
 .task
   flex 1