|
@@ -1,7 +1,7 @@
|
|
|
<template>
|
|
|
<div class='overview'>
|
|
|
<!-- 顶部路由 -->
|
|
|
- <div class='menu'>
|
|
|
+ <!-- <div class='menu'>
|
|
|
<div class='home' @click='$emit("update:modelNum", 0)'>
|
|
|
<div class='downright'></div>
|
|
|
<div class='home-box'>
|
|
@@ -14,7 +14,7 @@
|
|
|
<span class='span3'>{{times}}</span>
|
|
|
</span>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
<!-- 面包屑 -->
|
|
|
<nav class='navigation'>
|
|
|
<section class='crumbs'>
|
|
@@ -113,7 +113,7 @@
|
|
|
<transition name="selectDownUpExtendTop">
|
|
|
<div class="tool-tip" v-if="item.showToolTip">
|
|
|
<h5 style="font-weight:bold;">{{item.title + '比值'}}</h5>
|
|
|
- <p>{{item.title === '专维' ? '逾期未完成/即将到期任务数/任务总数' : '逾期未完成/任务总数'}}</p>
|
|
|
+ <p>{{item.title === '专维' ? '逾期未完成/今年即将到期任务数/总任务' : '当月即将到期/总任务'}}</p>
|
|
|
<div class="tip-triangle" :style="{left: item.title === '第三方检测' ? '12.5rem': '7.8rem'}"> </div>
|
|
|
</div>
|
|
|
</transition>
|
|
@@ -128,7 +128,7 @@
|
|
|
<span>{{option.rptGlsmsStatistics.total}}</span>
|
|
|
</span>
|
|
|
<span v-else>
|
|
|
- <span>{{option.rptGlsmsStatistics.unfinished}} /</span>
|
|
|
+ <span>{{option.rptGlsmsStatistics.due_num}} /</span>
|
|
|
<span>{{option.rptGlsmsStatistics.total}}</span>
|
|
|
</span>
|
|
|
</div>
|
|
@@ -252,6 +252,11 @@ export default {
|
|
|
9: { inner: 2000, outer: 4000, offset: 0.08 },
|
|
|
10: { inner: 1000, outer: 2000, offset: 0.04 },
|
|
|
11: { inner: 1000, outer: 2000, offset: 0.04 }
|
|
|
+ },
|
|
|
+ barColors :{
|
|
|
+ 0: 'linear-gradient(to right, #F54E45 , #F54E45)', // 蓝色
|
|
|
+ 1: 'linear-gradient(to right, #F58300 , #F58300)', // 黄色
|
|
|
+ 2: 'linear-gradient(to right, #369CF7 , #025BAA)' // 红色
|
|
|
}
|
|
|
}
|
|
|
},
|
|
@@ -311,8 +316,11 @@ export default {
|
|
|
navgateFromCrumbs(id, index) {
|
|
|
let data = this.getDataByCityCcode(id)
|
|
|
if (!data) return
|
|
|
- this.currentZoneData = data
|
|
|
let level = data.level //1集团 2中心 3区域 0广场
|
|
|
+ this.currentZoneData = data
|
|
|
+ this.currentLevel = level
|
|
|
+ this.getEventStatusData(level, data.ccode)
|
|
|
+ this.queryPlazaInfoCount(data.ccode, data.level, data.cid)
|
|
|
if (level === 1) {
|
|
|
this.pantGroupMap(data, this.currentSysId)
|
|
|
} else if (level === 2) {
|
|
@@ -324,8 +332,6 @@ export default {
|
|
|
},
|
|
|
// 获取 区域/中心/项目
|
|
|
selectProjectItem(ids, data) {
|
|
|
- localStorage.setItem('PLAZAID', '')
|
|
|
- this.$store.commit('STOREPLAZAID', '')
|
|
|
this.currentLevel = data.level
|
|
|
if (data.level === 0) { // level=0时 plazaId必填
|
|
|
this.queryPlazaInfoCount(data.ccode, data.level, data.cid)
|
|
@@ -412,6 +418,7 @@ export default {
|
|
|
this.currentLevel = level // 初始化的时候判断是哪一级 //1集团 2中心 3区域 0广场
|
|
|
data.open = true // 默认展开第一级
|
|
|
this.regulateDistrictData = [data]
|
|
|
+ this.currentDistrictData = res.treeData
|
|
|
this.getSystemList(data.ccode,level )
|
|
|
this.getEventStatusData(level, data.ccode)
|
|
|
if (level === 0) { // level=0时 plazaId必填
|
|
@@ -472,31 +479,40 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
/**
|
|
|
- * 计算长度
|
|
|
+ * 计算长度 维保、第三方检测是用即将逾期数据判断;专维是如果有逾期未完成直接标红,如果没有,按照即将逾期的数量显示颜色
|
|
|
*/
|
|
|
- barStyle(item) {
|
|
|
- let type = item.type
|
|
|
+ barStyle(item, title) {
|
|
|
+ let bg = ''
|
|
|
+ let type = this.selectColorByNum(item.due_num, item.total)
|
|
|
let ratio = 0
|
|
|
- if (item.title === '专维') {
|
|
|
+ if (title === '专维') {
|
|
|
+ if (item.unfinished>0) {
|
|
|
+ bg = 'linear-gradient(to right, #F54E45 , #F54E45)'
|
|
|
+ // bg='red'
|
|
|
+ } else {
|
|
|
+ bg = this.barColors[type]
|
|
|
+ }
|
|
|
ratio = ((item.unfinished + item.due_num) / item.total) * 100
|
|
|
} else {
|
|
|
- ratio = (item.unfinished / item.total) * 100
|
|
|
- }
|
|
|
- let bg = ''
|
|
|
- if (type === 0) {
|
|
|
- bg = 'linear-gradient(to right, #F54E45 , #F54E45)'
|
|
|
- }
|
|
|
- if (type === 1) {
|
|
|
- bg = 'linear-gradient(to right, #F58300 , #F58300)'
|
|
|
- }
|
|
|
- if (type === 2) {
|
|
|
- bg = 'linear-gradient(to right, #369CF7 , #025BAA)'
|
|
|
+ bg = this.barColors[type]
|
|
|
+ ratio = (item.due_num / item.total) * 100
|
|
|
}
|
|
|
return {
|
|
|
width: ratio + '%',
|
|
|
backgroundImage: bg
|
|
|
}
|
|
|
},
|
|
|
+ selectColorByNum (num, total) { // >= <=
|
|
|
+ let devide = num / total
|
|
|
+ // console.log(num, devide)
|
|
|
+ if ( (num > 1 && num <=24 ) || ( devide > 0.1 && devide <=0.2 ) ) {
|
|
|
+ return 0
|
|
|
+ } else if ( (num > 24 && num <= 49 ) || ( devide > 0.2 && devide <=0.5 ) ) {
|
|
|
+ return 1
|
|
|
+ } else {
|
|
|
+ return 2
|
|
|
+ }
|
|
|
+ },
|
|
|
// 根据数据渲染颜色
|
|
|
/**
|
|
|
* @description 获取集团 中心 区域 项目 数据树数据
|
|
@@ -606,11 +622,11 @@ export default {
|
|
|
if (res.result === 'success') {
|
|
|
let data = res.data
|
|
|
let orginalObj = {
|
|
|
- 0:{title:'专维',data:[], expand: 0, showToolTip:false},
|
|
|
1:{title:'维保',data:[], expand: 0, showToolTip:false},
|
|
|
- 2:{title:'第三方检测',data:[], expand: 0, showToolTip:false}
|
|
|
+ 2:{title:'第三方检测',data:[], expand: 0, showToolTip:false},
|
|
|
+ 0:{title:'专维',data:[], expand: 0, showToolTip:false},
|
|
|
}
|
|
|
- let arr = []
|
|
|
+ let arr = new Array(3)
|
|
|
for (let key in data) {
|
|
|
let obj = {}
|
|
|
let sortData = data[key]
|
|
@@ -629,9 +645,9 @@ export default {
|
|
|
orginalObj[key].data = sortBy(sortData, option => {return option.sort }).reverse()
|
|
|
}
|
|
|
}
|
|
|
- for ( let key in orginalObj) {
|
|
|
- arr.push(orginalObj[key])
|
|
|
- }
|
|
|
+ arr[0] = orginalObj[1]
|
|
|
+ arr[1] = orginalObj[2]
|
|
|
+ arr[2] = orginalObj[0]
|
|
|
this.maintainList = arr
|
|
|
}
|
|
|
})
|
|
@@ -887,8 +903,6 @@ export default {
|
|
|
className: 'my-leaflet-div-icon',
|
|
|
iconSize: 30
|
|
|
})
|
|
|
- localStorage.setItem('PLAZAID', '')
|
|
|
- this.$store.commit('STOREPLAZAID', '')
|
|
|
setTimeout(()=>{
|
|
|
let zoom = myMaps.getZoom()
|
|
|
let sizes = this.circleSize[zoom]
|
|
@@ -902,6 +916,10 @@ export default {
|
|
|
popup.openOn(myMaps)
|
|
|
})
|
|
|
feaureGroup.on('click', ev => {
|
|
|
+ this.currentZoneData = data
|
|
|
+ this.currentLevel = data.level
|
|
|
+ this.getEventStatusData(data.level, data.ccode)
|
|
|
+ this.queryPlazaInfoCount(data.ccode, data.level)
|
|
|
groupLayer.clearLayers()
|
|
|
this.createNavpathByData(data)
|
|
|
if (type === 'group') {
|
|
@@ -1003,7 +1021,8 @@ export default {
|
|
|
box-shadow: 0px 2px 10px 0px rgba(31, 35, 41, 0.1);
|
|
|
overflow: hidden;
|
|
|
.home {
|
|
|
- width: 265px;
|
|
|
+ min-width: 265px;
|
|
|
+ max-width: 320px;
|
|
|
height: 48px;
|
|
|
// line-height: 48px;
|
|
|
text-align: center;
|
|
@@ -1235,7 +1254,7 @@ export default {
|
|
|
span {
|
|
|
position: absolute;
|
|
|
top: -1.6rem;
|
|
|
- right: -1rem;
|
|
|
+ right: -2rem;
|
|
|
padding: 2px 4px;
|
|
|
border-radius: 0.9rem;
|
|
|
font-size: 1.2rem;
|