|  |  | 
 |  |  |                   更多<i class="el-icon-arrow-right"></i> | 
 |  |  |                 </div> --> | 
 |  |  |               </div> | 
 |  |  |               <div class="echart" id="echart2"></div> | 
 |  |  |               <template  v-if="tabPosition==='right'" >  <div class="echart" id="echart2"></div></template> | 
 |  |  |               <template  v-if="tabPosition==='top'" >  <div class="echart"  id="echart21"></div></template> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |           <div class="df"> | 
 |  |  | 
 |  |  |         { name: '访客报备', path: '', url: require('@/assets/icons/home_func1.png'), path: '/business/reportRecord' }, | 
 |  |  |         { name: '隐患随手拍', path: '', url: require('@/assets/icons/home_func2.png'), path: '/operation/danger/record' }, | 
 |  |  |         { name: '预约会议室', path: '', url: require('@/assets/icons/home_func3.png'), path: '/meeting/bookings' }, | 
 |  |  |         { name: '公务车预约', path: '', url: require('@/assets/icons/home_func5.png'), path: '/operation/serviceCar/apprRecord' }, | 
 |  |  |         { name: '考勤工作台', path: '', url: require('@/assets/icons/home_func4.png') }, | 
 |  |  |         { name: '食堂消费', path: '', url: require('@/assets/icons/8.png') } | 
 |  |  |       ], | 
 |  |  | 
 |  |  |     this.initData() | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     changeType(e) { | 
 |  |  |     changeType (e) { | 
 |  |  |       console.log(e) | 
 |  |  |       this.initEchart2() | 
 |  |  |       this.initEchart21() | 
 |  |  |     }, | 
 |  |  |     getNoticeList(){ | 
 |  |  |     getNoticeList () { | 
 |  |  |       syncHkNotice().then(res => { | 
 |  |  |  | 
 |  |  |       }) | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     getWorkBody () { | 
 |  |  |       getWorkbenchData({ queryType: 2 }).then(res => { | 
 |  |  |         console.log(res) | 
 |  |  |         this.staticData = res || {} | 
 |  |  |         this.initEchart2() | 
 |  |  |         this.initEchart21() | 
 |  |  |         this.initEchart3() | 
 |  |  |         this.initEchart4() | 
 |  |  |       }) | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     handleDetail (row) { | 
 |  |  |       if (row.type === 7) { | 
 |  |  |        this.handleTest(row); | 
 |  |  |         this.handleTest(row) | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       if (row.objType === 2) { | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     initEchart2 () { | 
 |  |  |       console.log('initEchart2') | 
 |  |  |       if (!document.getElementById('echart2')) { | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       echarts.dispose(document.getElementById('echart2')) | 
 |  |  |       const myChart = echarts.init(document.getElementById('echart2')) | 
 |  |  |       const that = this | 
 |  |  |       var ydata = that.staticData.internalList.map(i => i.num) | 
 |  |  |       let maxNum = 1 | 
 |  |  |       ydata.forEach((item, index) => { | 
 |  |  |         maxNum = item > maxNum ? item : maxNum | 
 |  |  |       }) | 
 |  |  |       myChart.setOption({ | 
 |  |  |         dataZoom: [ | 
 |  |  |           { | 
 |  |  |             type: 'slider', // 滑动条类型 | 
 |  |  |             orient: 'vertical', | 
 |  |  |             left: 'left', | 
 |  |  |             showDetail: false, | 
 |  |  |             start: 0, // 起始位置(百分比) | 
 |  |  |             end: 40, // 结束位置(百分比),控制初始显示范围 | 
 |  |  |             width: 4, | 
 |  |  |             dataBackground: { | 
 |  |  |               areaStyle: { opacity: 0 }, // 设置背景透明 | 
 |  |  |               lineStyle: { opacity: 0 } // 设置背景透明 | 
 |  |  |             } | 
 |  |  |             // moveOnMouseWheel: true, | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             type: 'inside', // 用于监听滚轮事件 | 
 |  |  |             orient: 'vertical', | 
 |  |  |             start: 0, | 
 |  |  |             end: 40, | 
 |  |  |             showDetail: false, | 
 |  |  |             minSpan: 40, | 
 |  |  |             dataBackground: { | 
 |  |  |               areaStyle: { opacity: 0 } // 设置背景透明 | 
 |  |  |             }, | 
 |  |  |             maxSpan: 40, | 
 |  |  |             zoomLock: true // 锁定缩放(仅允许平移) | 
 |  |  |             // moveOnMouseWheel: true, // 启用滚轮平移 | 
 |  |  |           } | 
 |  |  |         ], | 
 |  |  |         grid: { | 
 |  |  |           top: '4%', | 
 |  |  |           left: '2%', | 
 |  |  | 
 |  |  |         }, | 
 |  |  |         xAxis: { | 
 |  |  |           type: 'value', | 
 |  |  |           position: 'bottom', | 
 |  |  |           position: 'top', | 
 |  |  |           splitLine: { | 
 |  |  |             show: true, | 
 |  |  |             lineStyle: { | 
 |  |  |               // 这里输入线条的样式 | 
 |  |  |               color: 'rgba(255,255,255,0.14)' | 
 |  |  |             } | 
 |  |  |           } | 
 |  |  |           }, | 
 |  |  |           axisLabel: { | 
 |  |  |             formatter: function (value) { | 
 |  |  |               const intValue = Math.round(value) | 
 |  |  |               return intValue > 0 ? intValue : '' | 
 |  |  |             } | 
 |  |  |           }, | 
 |  |  |           minInterval: 1, | 
 |  |  |           min: 1 | 
 |  |  |           // max: maxNum | 
 |  |  |         }, | 
 |  |  |         yAxis: { | 
 |  |  |           type: 'category', | 
 |  |  |           data: that.tabPosition === 'top' ? that.staticData.lwList.map(i => i.name) : that.staticData.internalList.map(i => i.name) | 
 |  |  |           inverse: true, | 
 |  |  |           data: that.staticData.internalList.map(i => i.name), | 
 |  |  |           axisLabel: { | 
 |  |  |             interval: 0 | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         series: [ | 
 |  |  |           { | 
 |  |  |             data: that.tabPosition === 'top' ? that.staticData.lwList.map(i => i.num) : that.staticData.internalList.map(i => i.num), | 
 |  |  |             data: ydata, | 
 |  |  |             type: 'bar', | 
 |  |  |             barWidth: 10, | 
 |  |  |             itemStyle: { | 
 |  |  |               normal: { | 
 |  |  |                 color: new echarts.graphic.LinearGradient( | 
 |  |  |                   1, 0, 0, 0, | 
 |  |  |                   [ | 
 |  |  |                     { offset: 0, color: '#56abf8' }, | 
 |  |  |                     { offset: 1, color: '#407ff0' } | 
 |  |  |                   ] | 
 |  |  |                 ) | 
 |  |  |                 // barBorderRadius: [0, 10, 10, 0] | 
 |  |  |               } | 
 |  |  |             } | 
 |  |  |           } | 
 |  |  |         ] | 
 |  |  |       }) | 
 |  |  |       window.addEventListener('resize', function () { // 执行 | 
 |  |  |         myChart.resize() | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     initEchart21 () { | 
 |  |  |       console.log('initEchart21',this.staticData.lwList) | 
 |  |  |       if (!document.getElementById('echart21')) { | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       echarts.dispose(document.getElementById('echart21')) | 
 |  |  |       const myChart = echarts.init(document.getElementById('echart21')) | 
 |  |  |       const that = this | 
 |  |  |       var le1 = that.staticData.internalList.length | 
 |  |  |       var le2 = that.staticData.lwList.length | 
 |  |  |       const end = Math.round(40 * ((le1>0&& le2>0?le1:1) / (le1>0&& le2>0?le2:1)))+10 | 
 |  |  |       myChart.setOption({ | 
 |  |  |         dataZoom: [ | 
 |  |  |           { | 
 |  |  |             type: 'slider', // 滑动条类型 | 
 |  |  |             orient: 'vertical', | 
 |  |  |             left: 'left', | 
 |  |  |             showDetail: false, | 
 |  |  |             start: 0, // 起始位置(百分比) | 
 |  |  |             end: end, // 结束位置(百分比),控制初始显示范围 | 
 |  |  |             width: 4, | 
 |  |  |             dataBackground: { | 
 |  |  |               areaStyle: { opacity: 0 }, // 设置背景透明 | 
 |  |  |               lineStyle: { opacity: 0 } // 设置背景透明 | 
 |  |  |             }, | 
 |  |  |             zoomLock: true, // 锁定缩放(仅允许平移) | 
 |  |  |             moveOnMouseWheel: true | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             type: 'inside', // 用于监听滚轮事件 | 
 |  |  |             orient: 'vertical', | 
 |  |  |             start: 0, | 
 |  |  |             end: end, | 
 |  |  |             showDetail: false, | 
 |  |  |             minSpan: end, | 
 |  |  |             dataBackground: { | 
 |  |  |               areaStyle: { opacity: 0 } // 设置背景透明 | 
 |  |  |             }, | 
 |  |  |             maxSpan: end, | 
 |  |  |             zoomLock: true, // 锁定缩放(仅允许平移) | 
 |  |  |             moveOnMouseWheel: true // 启用滚轮平移 | 
 |  |  |           } | 
 |  |  |         ], | 
 |  |  |         grid: { | 
 |  |  |           top: '4%', | 
 |  |  |           left: '2%', | 
 |  |  |           right: '6%', | 
 |  |  |           bottom: '2%', | 
 |  |  |           containLabel: true | 
 |  |  |         }, | 
 |  |  |         tooltip: { | 
 |  |  |           trigger: 'axis', | 
 |  |  |           axisPointer: { | 
 |  |  |             type: 'line' | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         xAxis: { | 
 |  |  |           type: 'value', | 
 |  |  |           position: 'top', | 
 |  |  |           splitLine: { | 
 |  |  |             show: true, | 
 |  |  |             lineStyle: { | 
 |  |  |               // 这里输入线条的样式 | 
 |  |  |               color: 'rgba(255,255,255,0.14)' | 
 |  |  |             } | 
 |  |  |           }, | 
 |  |  |           axisLabel: { | 
 |  |  |             formatter: function (value) { | 
 |  |  |               const intValue = Math.round(value) | 
 |  |  |               return intValue > 0 ? intValue : '' | 
 |  |  |             } | 
 |  |  |           }, | 
 |  |  |           minInterval: 1, | 
 |  |  |           min: 1 | 
 |  |  |         }, | 
 |  |  |         yAxis: { | 
 |  |  |           type: 'category', | 
 |  |  |           inverse: true, | 
 |  |  |           data:  that.staticData.lwList.map(i => i.name), | 
 |  |  |           axisLabel: { | 
 |  |  |             interval: 0 | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         series: [ | 
 |  |  |           { | 
 |  |  |             data: that.staticData.lwList.map(i => i.num), | 
 |  |  |             type: 'bar', | 
 |  |  |             barWidth: 10, | 
 |  |  |             itemStyle: { | 
 |  |  | 
 |  |  |           nameTextStyle: { | 
 |  |  |             padding: [0, 0, 4, -30] // 四个数字分别为上右下左与原位置距离 | 
 |  |  |           }, | 
 |  |  |           axisLabel: { | 
 |  |  |             formatter: function (value) { | 
 |  |  |               const intValue = Math.round(value) | 
 |  |  |               return intValue > 0 ? intValue : '' | 
 |  |  |             } | 
 |  |  |           }, | 
 |  |  |           minInterval: 1, | 
 |  |  |           min: 1, | 
 |  |  |           splitLine: { | 
 |  |  |             show: true, | 
 |  |  |             lineStyle: { | 
 |  |  | 
 |  |  |               // 这里输入线条的样式 | 
 |  |  |               color: 'rgba(255,255,255,0.14)' | 
 |  |  |             } | 
 |  |  |           } | 
 |  |  |           }, | 
 |  |  |           axisLabel: { | 
 |  |  |             formatter: function (value) { | 
 |  |  |               const intValue = Math.round(value) | 
 |  |  |               return intValue > 0 ? intValue : '' | 
 |  |  |             } | 
 |  |  |           }, | 
 |  |  |           minInterval: 1, | 
 |  |  |           min: 1 | 
 |  |  |         }, | 
 |  |  |         grid: { | 
 |  |  |           top: '16%', |