调整

src/components/MonitorComponents/MonitorForm/monitor-form.vue

@@ -5,7 +5,7 @@
       <i-col class="col" v-for="(col, key) in row" :key="key" :span="col.width" :offset="col.offset || 0">
         <div :style="`text-align: ${col.align || 'right'}; width:${labelWidth}rem;`">{{col.label}}：</div>
         <template v-if="col.type == 'img'">
-          <img v-for="img in model[key].split(',')" :key="img" @click="handleView(img)" :src="img" />
+          <img v-for="img in model[key] && model[key].split(',')" :key="img" @click="handleView(img)" :src="img" />
         </template>
         <div v-else class="content">{{col.format ? col.format(model[key]) : (model[key] || ' ')}}</div>
       </i-col>

src/server/api.js

@@ -33,4 +33,5 @@ export default {
   GET_GARBAGE_COUNT: '/dc/countPointsByStreet', // 街道垃圾收集点数目
   GET_TOILET_COUNT: '/dc/countToiletsByStreet', // 街道环卫公厕数目
   GET_VIDEO_URL: 'http://10.89.1.208:7000/hawkeye/api/v1/camera/', // 后面接id获取视频地址
+  GET_HEALTH_INFO: '/service-documents-ddd/public/property/health/degree', // 物业健康度
 }

src/store/actions.js

@@ -23,6 +23,7 @@ export default {
     dispatch('getRepairInfo')
     dispatch('getHandleList')
     dispatch('getDoneList')
+    dispatch('getHealthInfo')
   },
   async getGreenInfo({commit}) {
     const result = [
@@ -147,4 +148,9 @@ export default {
       commit('SET_DONE_LIST', com.confirm(res, 'data.content', []))
     })
   },
+  getHealthInfo({commit}) { // 健康度
+    ajax.get({url: api.GET_HEALTH_INFO}).then(res => {
+      commit('SET_HEALTH_INFO', com.confirm(res, 'data.content', {}))
+    })
+  },
 }

src/store/mutations.js

@@ -60,4 +60,7 @@ export default {
   SET_DONE_LIST(state, data) {
     state.doneList = data
   },
+  SET_HEALTH_INFO(state, data) {
+    state.healthInfo = data
+  },
 }

src/store/state.js

@@ -77,6 +77,13 @@ export default {
     {id: 310110020000, name: '新江湾城街道', houseId: 310110000168, center: [3635.8506067447124, 10472.688944671301]},
     {id: 310110101000, name: '长海路街道', houseId: 310110000175, center: [6016.66261261553, 8153.563542586172]},
   ],
+  healthInfo: {
+    creditScore: {},
+    propertyWarrantyScore: {},
+    communityManagementScore: {},
+    ownerSatisfactionScore: {},
+    monthCheck: {},
+  },
   currentStreetInfo: {id: 310110020000, name: '新江湾城街道', houseId: 310110000168, center: [3635.8506067447124, 10472.688944671301]},
   showLoading: false,
   curDate: null,

src/views/components/combine.vue

@@ -50,9 +50,9 @@ export default {
       return this.handleCurTab === '处置中'
     },
     list() {
-      // if (this.handleCurTab === '已完成') {
-      //   return this.doneList
-      // }
+      if (this.handleCurTab === '已完成') {
+        return this.doneList
+      }
       if (this.curSmartType) {
         return this.handleList.filter(item => item.types === this.curSmartType)
       }

src/views/components/done-component.vue

@@ -4,8 +4,8 @@
       <p class="title"><span class="dot"/>风险报警信息</p>
       <m-form :label-width=".6" :model="data" :layout="layout" />
     </div>
-    <div v-for="item in data.details" :key="item.id">
-      <p class="title"><span class="dot"/>{{item.disposalDept}}处置</p>
+    <div v-for="(item, i) in data.details" :key="item.id">
+      <p class="title"><span class="dot"/>{{i == 0 ? '物业' : '街道'}}处置</p>
       <m-form :label-width=".6" :model="item" :layout="detailLayout" />
     </div>
   </div>

src/views/components/house.vue

@@ -11,7 +11,7 @@
       <div class="total">
         <div>
           <p>整体治理得分</p>
-          <m-count style="font-size:0.12rem;color:#75e1b0;" :value="92" :decimal="0" />
+          <m-count :style="`font-size:0.12rem;color:${switchColor};`" :value="total" :decimal="0" />
           <p class="unit">（分）</p>
         </div>
         <span class="btn">查看模型</span>
@@ -25,13 +25,31 @@
 
 <script>
 import echarts from 'echarts'
-const mockValue = [49, 21, 22]
 export default {
   name: 'House',
   data() {
     return {
       chart: null,
-      option: {
+    }
+  },
+  mounted() {
+    setTimeout(this.init, 0)
+  },
+  beforeDestroy() {
+    this.chart && window.removeEventListener('resize', () => this.chart.resize())
+  },
+  computed: {
+    list() {
+      const {community, house, company, area} = this.$store.state.resourceSum
+      return [
+        {name: '小区数量', unit: '个', value: +community || 0},
+        {name: '总户数', unit: '户', value: +house || 0},
+        {name: '物业企业', unit: '个', value: +company || 0},
+        {name: '管理面积', unit: '㎡', value: +area || 0},
+      ]
+    },
+    option() {
+      return {
         tooltip: {
           trigger: 'axis',
           confine: true,
@@ -51,19 +69,16 @@ export default {
               },
               c: {
                 color: '#fff',
+                align: 'center',
                 fontSize: 12 * this.sizeRate,
               },
             },
             formatter: (text, {index}) => {
-              const max = [50, 25, 25]
-              return `{a|${text}}\n{b|${mockValue[index]}}{c|/${max[index]}}`
+              return `{a|${text}}\n{b|${this.chartData[index]}}{c|/20}`
             },
           },
           splitArea: {
             show: false,
-            // areaStyle: {
-            //   color: ['rgba(1,124,143, 1)', 'rgba(1,124,143,0.9)', 'rgba(1,124,143,.7)', 'rgba(1,124,143,.5)', 'rgba(1,124,143,.3)']
-            // }
           },
           splitLine: {
             show: true,
@@ -75,9 +90,11 @@ export default {
             show: false,
           },
           indicator: [
-            {text: '安全', index: 0, max: 50},
-            {text: '干净', index: 1, max: 25},
-            {text: '有序', index: 2, max: 25},
+            {text: '物业诚信计分', index: 0, max: 20},
+            {text: '投诉报修情况', index: 1, max: 20},
+            {text: '小区管理情况', index: 2, max: 20},
+            {text: '业主满意度', index: 3, max: 20},
+            {text: '行业落实情况', index: 4, max: 20},
           ],
           center: ['50%', '60%'],
           radius: '65%',
@@ -92,28 +109,36 @@ export default {
             color: '#47B3FF',
           },
           data: [{
-            value: mockValue,
+            value: this.chartData,
           }]
         }]
       }
-    }
-  },
-  mounted() {
-    setTimeout(this.init, 0)
-  },
-  beforeDestroy() {
-    this.chart && window.removeEventListener('resize', () => this.chart.resize())
-  },
-  computed: {
-    list() {
-      const {community, house, company, area} = this.$store.state.resourceSum
+    },
+    chartData() {
+      const {id} = this.$store.state.currentStreetInfo
+      const {creditScore, propertyWarrantyScore, communityManagementScore, ownerSatisfactionScore, monthCheck} = this.$store.state.healthInfo
       return [
-        {name: '小区数量', unit: '个', value: +community || 0},
-        {name: '总户数', unit: '户', value: +house || 0},
-        {name: '物业企业', unit: '个', value: +company || 0},
-        {name: '管理面积', unit: '㎡', value: +area || 0},
+        +creditScore[id + ''] || 0,
+        +propertyWarrantyScore[id + ''] || 0,
+        +communityManagementScore[id + ''] || 0,
+        +ownerSatisfactionScore[id + ''] || 0,
+        +monthCheck[id + ''] || 0,
       ]
     },
+    total() {
+      return this.chartData.reduce((cur, acc) => cur + acc, 0)
+    },
+    switchColor() {
+      if (this.total >= 90) {
+        return '#75e1b0'
+      }
+      if (this.total < 90 && this.total >= 80) {
+        return '#ffd400'
+      }
+      if (this.total < 80) {
+        return '#ff1e1e'
+      }
+    },
     sizeRate() {
       return Number((screen.height / 800).toFixed(1))
     },
@@ -124,7 +149,12 @@ export default {
       window.addEventListener('resize', () => this.chart.resize())
       this.chart.setOption(this.option)
     }
-  }
+  },
+  watch: {
+    chartData() {
+      this.chart && this.chart.setOption(this.option)
+    },
+  },
 }
 </script>
 

src/views/main.vue

@@ -27,7 +27,7 @@
     <m-modal v-model="detailModal" title="智能报警">
       <m-form :label-width=".6" :model="detailData" :layout="detailLayout" />
     </m-modal>
-    <m-modal v-model="doneModal" title="已完成处置列表">
+    <m-modal v-model="doneModal" title="已完成处置">
       <DoneComponent v-if="doneModal" :data="doneData" />
     </m-modal>
     <m-modal v-model="patrolModal" title="主动巡检">
@@ -216,6 +216,7 @@ export default {
         this.detailData = data
         this.detailModal = true
       } else {
+        console.log(this.doneData)
         this.doneData = data
         this.doneModal = true
       }