var intervalTime = 5 * 1000; $(function(){ window.onload = function() { var show = document.getElementById("hours"); var year = document.getElementById("year"); setInterval(function() { var time = new Date(); // 程序计时的月从0开始取值后+1 var m = time.getMonth() + 1; var hours = time.getHours(); var minutes = time.getMinutes(); var seconds = time.getSeconds(); hours = checkTime(hours); minutes = checkTime(minutes); seconds = checkTime(seconds); var t = hours + ":" + minutes + ":" + seconds; show.innerHTML = t; }, 1000); setInterval(function() { var timeYear = new Date(); var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]; var mynum=timeYear.getDay(); //星期 // 程序计时的月从0开始取值后+1 var ms = timeYear.getMonth() + 1; var ts = timeYear.getFullYear() + "年" + ms + "月" + timeYear.getDate()+"日"+weekday[mynum]; year.innerHTML = ts; }, 1000); function checkTime(i) { // 将0-9的数字前面加上0,例1变为01 if(i < 10) { i = "0" + i; } return i; } }; // var projectCountDom = document.getElementById('projectCount'); // projectCountDom.onclick = function(){ // var index = top.layer.open({ // title: false, // type: 2, // content: '../../page/tarin/projectInfo.html', // area: ['90%', '90%'], // maxmin: false // }); // } // //获取当前城市 var myCity = new BMap.LocalCity(); myCity.get(function(data){ var cityData = document.getElementById("city"); cityData.innerHTML=data.name; }); getAgeStructureList();//年龄结构 // getProList();//项目概况 getWorkerList();//考勤管理 getWorkerPostList();//数据统计 getContractList();//合同管理 //getSalaryList();//工资统计 // getWorkerRecordList();//人员出入场统计 getWorkerRedBlackWhiteList();//红黑白名单 getWorkerPostCardList();//施工人脸甄别 // getProjectCount(); }) //Echarts数据加载 //年龄结构 function getAgeStructureList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getAgeStructureList', data: {companyId:companyId}, dataType: "json", // 手动添加请求头 beforeSend: function(xhr) { // 从本地存储获取token(确保登录后已保存) const token = localStorage.getItem('smzweb-token') || sessionStorage.getItem('smzweb-token'); if (token) { xhr.setRequestHeader('x-auth-token', token); // 与后端配置的头名一致 } }, success: function(data) { var list = data.obj.list; age1Echarts(list); } }); } //在建工程数量 /*function getProjectCount(){ $.ajax({ type: 'GET', url: smz_web_url + 'workerPost/getProjectStatusCount', data: { }, dataType: "json", success: function(data) { var obj=data; document.getElementById('projectCount').innerText = '在建工程数量:'+obj; } }); }*/ //项目概况 function getProList(data){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getProList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; var list=obj.list; var counts=list.counts;//总数 var countsA=list.countsA;//在建数 var countsB=list.countsB;//已完工数 var agvA=list.agvA;//在建百分比 var agvB=list.agvB;//已完工百分比 unfinishedProEcharts(countsA,agvA);//在建 overProEcharts(countsB,agvB);//已完工 } }); } //数据统计 function getWorkerPostList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getWorkerPostList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; console.log("工种",obj.list) var list=obj.list;//集合 workTypeEcharts(list); } }); } //工种证统计统计 function getWorkerPostCardList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getWorkerPostCardList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; console.log("工种证书",obj.list) var list=obj.list;//集合 $.ajax({ type: 'GET', url: smz_web_url + 'workerPost/gerWorkerPersonAlls', async: false, data: {}, dataType: "json", success: function(data) { var allcard = data; getWorkerPostCardListEcharts(list,allcard); } }); } }); } //人员出入场统计 function getWorkerRecordList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getWorkerRecordList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; var name=obj.name;//工程名称 var inCount=obj.inCount;//入场 var outCount=obj.outCount;//出场 inOutEcharts(name,inCount,outCount); } }); } //红黑白名单 function getWorkerRedBlackWhiteList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getWorkerRedBlackWhiteList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; var redCount=obj.redCount;//红名单 var blackCount=obj.blackCount;//黑名单 var whiteCount=obj.whiteCount;//黑名单 redBlackWhiteEcharts(redCount,blackCount,whiteCount);//红黑白名单 } }); } //人员管理 var allcountrc=0; function getWorkerList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getWorkerList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; var counts=obj.counts;//人员管理-总人数(入场+出场) var zcCount=obj.zcCount;//在场人数 var kqCount=obj.kqCount;//当日考勤人数 var kqReviewedCount=obj.kqReviewedCount;//当日考勤已审核人数 var proId=obj.proId;//工程集合 var name=obj.name;//工程集合 var abbreviation=obj.abbreviation;//工程简称集合 var zcList=obj.zcList;//在场人数集合((入场+出场)-出场) var kqList=obj.kqList;//当日考勤集合 var kqReviewedList=obj.kqReviewedList//当日考勤已审核集合 peopleEcharts(name,zcList,kqList,kqReviewedList,abbreviation,proId); document.getElementById("zcData").innerHTML="在场人数:"+zcCount+"人"; document.getElementById("kqData").innerHTML="今日打卡人数:"+kqCount+"人"; document.getElementById("kqReviewedData").innerHTML="休息人数:"+kqReviewedCount+"人"; allcountrc=zcCount; leftDivData(); rightDivData(); leftDiv(); rightDiv(); } }); } //工资统计 function getSalaryList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getSalaryList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; var name=obj.name;//工程集合 var inList=obj.inList;//已生效集合d var noList=obj.noList;//待发放集合 wagesEcharts(name,inList,noList);//工资统计 } }); } //合同管理 function getContractList(){ $.ajax({ type: 'POST', url: smz_web_url + 'home/getContractList', data: {companyId:companyId}, dataType: "json", success: function(data) { var obj=data.obj; var proid=obj.proid; var name=obj.name;//工程集合 var yqd=obj.yqd;//已签订 var dsh=obj.dsh;//待审核 var wqd=obj.wqd;//未签订 contractEcharts(proid,name,yqd,dsh,wqd);//合同统计 } }); } //项目概况-已完工 function overProEcharts(countsB,agvB){ var myChart = echarts.init(document.getElementById('overPro')); var num1=countsB; var num2=agvB; var dataArr={data:num1,percent:agvB}; var option = { title:[ { text: `{a|${dataArr.data}}{b|}`, top: '50%', left: 'center', textStyle: { fontWeight: 'normal', rich: { a: { fontWeight: 'normal', fontSize: 30, color: '#FFF', textShadowColor: '#7f00fcff', textShadowBlur: 10, fontFamily: 'Microsoft YaHei', } } } } ], series: [{ name: "内层进度条", z:3, type: "gauge", // 仪表盘 center:['center','55%'], radius:'67%', detail: { show:false, }, title: { show: false }, data: [{ value: dataArr.data, name: "Percent" }], startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 min:0, max:100, splitNumber:20, axisLine:{ show:true, lineStyle:{ roundCap:true, width:30, color:[[dataArr.percent, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ offset: 0, color: '#6FE9FE' }, { offset: 1, color: '#FFC4DD' // 100% 处的颜色 } ])], [1, '#15337C']], } }, axisTick: { show: false }, axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 } }, { name: "外层进度条", type: "gauge", // 仪表盘 z:2, center:['center','55%'], radius:'85%', detail: { show: false, }, title: { show: false }, data: [{ value: dataArr.data, name: "Percent" }], startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 min:0, max:100, axisLine:{ show:true, lineStyle:{ roundCap:true, width:35, color:[[dataArr.percent, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ offset: 0, color: 'RGB(111,233,254,0.1)' }, { offset: 1, color: '#FFC4DD' // 100% 处的颜色 } ])], [1, '#15337C']], } }, axisTick: { show: false }, axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 } }, { name:'外层刻度', type:'gauge', center:['center','55%'], radius:'44%', detail: { show: false, }, min:0, max:100, startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 }, axisLine:{ show: false }, axisTick:{ show: true, splitNumber: 4, lineStyle: { color: '#7987AE', //用颜色渐变函数不起作用 width: 3 }, length: 6 } }, { name:'内部刻度', type:'gauge', center:['center','55%'], radius:'30%', detail: { show: false, }, startAngle:'0', // 仪表盘起始角度 endAngle :'360', // 仪表盘结束角度 axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 }, axisLine:{ show: false }, axisTick:{ show: true, splitNumber: 8, lineStyle: { color: '#7987AE', //用颜色渐变函数不起作用 width: 2 }, length: 3 }, detail: { formatter: '已完工', offsetCenter: ['0', '200%'], textStyle: { fontSize:25, color: '#FFFFFF', }, }, }, { name:'内部实心圆', type:'pie', silent:true, animation: false, center:['center','55%'], radius:'28%', label:{ show:false, }, itemStyle: { normal: { color: '#041a63' } }, data: [{ value: 100 }] }, { name:'外层背景', z:1, type:'gauge', center:['center','55%'], radius:'45%', detail: { show: false, }, startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 splitLine: { show: false }, axisTick: { show: false }, axisLabel: { show: false }, splitLabel: { show: false }, pointer: { show: false }, axisLine: { lineStyle: { color: [[1, '#15337C']], width: '100%' } }, } ] } // 为echarts对象加载数据 myChart.setOption(option); } //项目概况-未完工 function unfinishedProEcharts(countsA,agvA){ var myChart = echarts.init(document.getElementById('unfinishedPro')); var num1=countsA; var num2=agvA; var dataArr={data:num1,percent:agvA}; var option = { title:[ { text: `{a|${dataArr.data}}{b|}`, top: '50%', left: 'center', textStyle: { fontWeight: 'normal', rich: { a: { fontWeight: 'normal', fontSize: 30, color: '#FFF', textShadowColor: '#7f00fcff', textShadowBlur: 10, fontFamily: 'Microsoft YaHei', } } } } ], series: [{ name: "内层进度条", z:3, type: "gauge", // 仪表盘 center:['center','55%'], radius:'67%', detail: { show:false, }, title: { show: false }, data: [{ value: dataArr.data, name: "Percent" }], startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 min:0, max:100, splitNumber:20, axisLine:{ show:true, lineStyle:{ roundCap:true, width:30, color:[[dataArr.percent, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ offset: 1, color: '#6FE9FE' }, { offset: 0, color: '#FFC4DD' // 100% 处的颜色 } ])], [1, '#15337C']], } }, axisTick: { show: false }, axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 } }, { name: "外层进度条", type: "gauge", // 仪表盘 z:2, center:['center','55%'], radius:'85%', detail: { show: false, }, title: { show: false }, data: [{ value: dataArr.data, name: "Percent" }], startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 min:0, max:100, axisLine:{ show:true, lineStyle:{ roundCap:true, width:35, color:[[dataArr.percent, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ offset: 1, color: 'RGB(111,233,254,0.1)' }, { offset: 0, color: '#FFC4DD' // 100% 处的颜色 } ])], [1, '#15337C']], } }, axisTick: { show: false }, axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 } }, { name:'外层刻度', type:'gauge', center:['center','55%'], radius:'44%', detail: { show: false, }, min:0, max:100, startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 }, axisLine:{ show: false }, axisTick:{ show: true, splitNumber: 4, lineStyle: { color: '#7987AE', //用颜色渐变函数不起作用 width: 3 }, length: 6 } }, { name:'内部刻度', type:'gauge', center:['center','55%'], radius:'30%', detail: { show: false, }, startAngle:'0', // 仪表盘起始角度 endAngle :'360', // 仪表盘结束角度 axisLabel: { show: false }, splitLine: { show: false, }, pointer: { show: false // 不展示指针 }, axisLine:{ show: false }, axisTick:{ show: true, splitNumber: 8, lineStyle: { color: '#7987AE', //用颜色渐变函数不起作用 width: 2 }, length: 3 }, detail: { formatter: '未完工', offsetCenter: ['0', '200%'], textStyle: { fontSize:25, color: '#FFFFFF', }, }, }, { name:'内部实心圆', type:'pie', silent:true, animation: false, center:['center','55%'], radius:'28%', label:{ show:false, }, itemStyle: { normal: { color: '#041a63' } }, data: [{ value: 100 }] }, { name:'外层背景', z:1, type:'gauge', center:['center','55%'], radius:'45%', detail: { show: false, }, startAngle:'225', // 仪表盘起始角度 endAngle :'-45', // 仪表盘结束角度 splitLine: { show: false }, axisTick: { show: false }, axisLabel: { show: false }, splitLabel: { show: false }, pointer: { show: false }, axisLine: { lineStyle: { color: [[1, '#15337C']], width: '100%' } }, } ] } // 为echarts对象加载数据 myChart.setOption(option); } //人员管理 function peopleEcharts(name,zcList,kqList,kqReviewedList,abbreviation,proId){ var myChart = echarts.init(document.getElementById('peopleEcharts')); var option = { barWidth: 10, grid: { top: '5%', left: '2%', right: '10%', bottom: '5%', containLabel: true, }, tooltip: { trigger: "axis", axisPointer: { type: 'none' }, formatter: function(params) { return params[0].name+'
'+params[0].seriesName + ' : ' + params[0].value+'
'+params[2].seriesName + ' : ' + params[2].value } }, xAxis: { type: 'value', splitLine: { show: false, }, axisTick: { show: false }, axisLine: { // 改变x轴颜色 show: false, }, axisLabel: { // 改变x轴字体颜色和大小 show: false, } }, yAxis: { type: 'category', data:name, splitLine: { show: false }, axisTick: { show: false }, axisLine: { // 改变y轴颜色 show: false, }, axisLabel: { // 改变y轴字体颜色和大小 textStyle: { color: "#fff", fontSize: 16 }, formatter: function(value) { var len = value.length; if(len>5){ return value.substring(0, 5) + "..." ; }else{ return value; } } } }, //滚动条 dataZoom: [{ show: false, height: 12, yAxisIndex: [0], bottom: '0%', start: 0, end: 2, zoomLock: true, //禁用缩放 handleSize: '110%', handleStyle: { color: "#d3dee5", }, textStyle: { color: "#fff" }, borderColor: "#90979c" }], series: [{ type: 'bar', name:'在场人数:', itemStyle: { normal: { label: { show: true, //开启显示 position: 'right', //在上方显示 textStyle: { //数值样式 color: "#fff", fontSize: 13, fontWeight: 600 } }, color: '#2ED8FB' }, }, data: zcList }, { // 分隔 type: 'pictorialBar', itemStyle: { normal: { color: '#000', }, }, symbolRepeat: 'fixed', symbolMargin: 12, symbol: 'rect', symbolClip: true, symbolSize: [1, 10], symbolPosition: 'start', symbolOffset: [-10, -13], data: zcList, z: 66, animationEasing: 'elasticOut', }, { type: 'bar', name:'今日打卡人数:', itemStyle: { normal: { label: { show: true, //开启显示 position: 'right', //在上方显示 textStyle: { //数值样式 color: "#fff", fontSize: 13, fontWeight: 600 } }, color: '#DDFCAC' } }, data: kqList },{ // 分隔 type: 'pictorialBar', itemStyle: { normal: { color: '#000', }, }, symbolRepeat: 'fixed', symbolMargin: 12, symbol: 'rect', symbolClip: true, symbolSize: [1, 10], symbolPosition: 'start', symbolOffset: [-10, 0], data: kqList, z: 66, animationEasing: 'elasticOut', }, { type: 'bar', name:'已审核人数:', itemStyle: { normal: { label: { show: true, //开启显示 position: 'right', //在上方显示 textStyle: { //数值样式 color: "#fff", fontSize: 13, fontWeight: 600 } }, color: '#18B794' } }, data: kqReviewedList, },{ // 分隔 type: 'pictorialBar', itemStyle: { normal: { color: '#000', }, }, symbolRepeat: 'fixed', symbolMargin: 12, symbol: 'rect', symbolClip: true, symbolSize: [1, 10], symbolPosition: 'start', symbolOffset: [-10, 13], data: kqReviewedList, z: 66, animationEasing: 'elasticOut', }, ] }; var startNum = 0; var endNum = 2; function zoomInterval() { if (endNum > 100) { option.dataZoom[0].start = 0; option.dataZoom[0].end = 2; startNum = 0; endNum = 2; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerInfo(name); }); } else { option.dataZoom[0].start = startNum; option.dataZoom[0].end = endNum; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerInfo(name); }); } startNum += 2; endNum += 2; }; var myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerInfo(name); }); myChart.on('mouseover', function(params) { clearInterval(myInterval); }); myChart.on('mouseout', function(params) { myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); }); } //数据统计 function workTypeEcharts(list){ var myChart = echarts.init(document.getElementById('workType')); var option = { color: ['#7eacea', '#e15777', '#95ea71', '#ea9b4f', '#7577df', '#be72d8', '#fff'], tooltip: { trigger: 'item', formatter: '{b} : {c} ({d}%)' }, series: [{ name: '', type: 'pie', radius: [30, 110], center: ['50%', '60%'], roseType: 'radius', label: { show: true, formatter: '{b}:{d}%;{c}', }, emphasis: { label: { show: true } }, data: list }, { name: '占位', type: 'pie', silent: true, center: ['50%', '60%'], radius: 30, hoverAnimation: false, label: { show: false, position: 'center' }, data: [{ value: 1, name: '占位2' }, ], itemStyle: { normal: { color: '#fff', shadowColor: 'rgba(0, 0, 0, 0.5)', shadowBlur: 10, }, } }] }; // 为echarts对象加载数据 myChart.setOption(option); myChart.on('click', function(params) { var name = params.name; openWorkerPostInfo(name); }); } //合同统计 function contractEcharts(proid,name,yqd,dsh,wqd){ var myChart = echarts.init(document.getElementById('contract')); var option = { legend: { top: 25, textStyle: { fontSize: 14, color: '#fff', }, data: ['已签订', '待审核', '未签订'] }, tooltip: { trigger: "axis", axisPointer: { type: "shadow", textStyle: { color: "#fff" } }, }, grid: { left: "5%", top: "20%", bottom: "5%", right: "5%", containLabel: true }, xAxis: { axisLabel: { interval:0, textStyle: { color: '#fff', fontSize: 15 }, formatter: function(value) { var len = value.length; if(len>5){ return value.substring(0, 5) + "..." ; }else{ return value; } } }, axisLine: { show:true, lineStyle: { color: '#1373C0' } }, data: name }, yAxis:[ { nameTextStyle:{ color: '#5C91C4', fontSize: 14, }, type: 'value', position: 'left', axisLabel: { formatter: '{value}', textStyle: { color: '#fff', fontSize: 15 }, }, axisLine: { show:true, lineStyle: { color: '#1373C0' } }, axisTick: { show: false }, splitLine: {show: false} }], //滚动条 dataZoom: [{ show: false, height: 12, xAxisIndex: [0], bottom: '0%', start: 0, end: 3, zoomLock: true, //禁用缩放 handleSize: '110%', handleStyle: { color: "#d3dee5", }, textStyle: { color: "#fff" }, borderColor: "#90979c" }], series: [{ type: "bar", name:'已签订', rawdate: proid, barWidth: 4, barGap: '400%', label: { show: true, formatter: "{a|}", color: "#fff", position: "top", distance: -10, backgroundColor: "#65E4A4", shadowColor: "#65E4A4", shadowBlur: 10, padding: 4, borderRadius: 8, rich: { a: { width: 6, height: 6, borderRadius: 6, lineHeight: 6, backgroundColor: "#65E4A4" } } }, itemStyle: { normal: { color: '#65E4A4' } }, data: yqd },{ type: "bar", name:'待审核', rawdate: proid, barWidth: 4, barGap: '400%', label: { show: true, formatter: "{a|}", color: "#fff", position: "top", distance: -10, backgroundColor: "#FAEF72", shadowColor: "#FAEF72", shadowBlur: 10, padding: 4, borderRadius: 8, rich: { a: { width: 6, height: 6, borderRadius: 6, lineHeight: 6, backgroundColor: "#FAEF72" } } }, itemStyle: { normal: { color: '#FAEF72' } }, data: dsh },{ type: "bar", name:'未签订', barWidth: 4, rawdate: proid, barGap: '400%', label: { show: true, formatter: "{a|}", color: "#000", position: "top", distance: -10, backgroundColor: "#F06A87", shadowColor: "#F06A87", shadowBlur: 10, padding: 4, borderRadius: 6, rich: { a: { width: 6, height: 6, borderRadius: 6, lineHeight: 6, backgroundColor: "#F06A87" } } }, itemStyle: { normal: { color: '#F06A87' } }, data: wqd }] }; var startNum = 0; var endNum = 3; function zoomInterval() { if (endNum > 100) { option.dataZoom[0].start = 0; option.dataZoom[0].end = 3; startNum = 0; endNum = 3; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(param) { var name = param.name; var seriesName = param.seriesName; var proid; var mes = '['+ param.type + ']'; if (typeof param.seriesIndex != 'undefined') { mes +='seriesIndex:'+ param.seriesIndex; mes +='dataIndex:'+ param.dataIndex; //alert(option.series[param.dataIndex].rawdate); proid = option.series[param.seriesIndex].rawdate[param.dataIndex]; } showContract(proid,seriesName); }); } else { option.dataZoom[0].start = startNum; option.dataZoom[0].end = endNum; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(param) { var name = param.name; var seriesName = param.seriesName; var proid; var mes = '['+ param.type + ']'; if (typeof param.seriesIndex != 'undefined') { mes +='seriesIndex:'+ param.seriesIndex; mes +='dataIndex:'+ param.dataIndex; //alert(option.series[param.dataIndex].rawdate); proid = option.series[param.seriesIndex].rawdate[param.dataIndex]; } showContract(proid,seriesName); }); } startNum += 3; endNum += 3; }; var myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(param) { var name = param.name; var seriesName = param.seriesName; var proid; var mes = '['+ param.type + ']'; if (typeof param.seriesIndex != 'undefined') { mes +='seriesIndex:'+ param.seriesIndex; mes +='dataIndex:'+ param.dataIndex; //alert(option.series[param.dataIndex].rawdate); proid = option.series[param.seriesIndex].rawdate[param.dataIndex]; } showContract(proid,seriesName); }); myChart.on('mouseover', function(params) { clearInterval(myInterval); }); myChart.on('mouseout', function(params) { myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); }); } //工资统计 function wagesEcharts(name,inList,noList){ var myChart = echarts.init(document.getElementById('wages')); var option = { legend: { top:'15%', data: ['已生效','待发放'], textStyle: { fontSize: 14, color: 'F1F1F3' }, }, grid: { top: '30%', left: '2%', right: '2%', bottom: '5%', containLabel: true, }, tooltip: { trigger: "axis", axisPointer: { type: 'line' }, }, xAxis: [{ type: 'category', boundaryGap: true, axisLine: { show: false, }, axisLabel: { interval:0, textStyle: { color: '#fff', fontSize: 14 }, formatter: function(value) { var len = value.length; if(len>5){ return value.substring(0, 5) + "..." ; }else{ return value; } } }, axisTick: { show: false, }, data: name, }], yAxis: [{ type: 'value', axisTick: { show: false, }, splitLine: { show: true, lineStyle: { color: '#1373C0', width: 1 } }, axisLine: { show: false, }, axisLabel: { textStyle: { color: '#fff', fontSize: 14 }, }, }], //滚动条 dataZoom: [{ show: false, height: 12, xAxisIndex: [0], bottom: '0%', start: 0, end: 20, zoomLock: true, //禁用缩放 handleSize: '110%', handleStyle: { color: "#d3dee5", }, textStyle: { color: "#fff" }, borderColor: "#90979c" }], series: [{ name: '已生效', type: 'line', smooth: true, showAllSymbol: true, symbolSize: 12, label: { show: true, position: 'top', }, itemStyle: { normal: { color: "rgba(1,201,204, 1)", } }, areaStyle: { //区域填充样式 normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgba(1,201,204, 0.28)' }, { offset: 1, color: 'rgba(1,201,204, 0.01)' } ], false), } }, data: inList },{ name: '待发放', type: 'line', smooth: true, showAllSymbol: true, symbolSize: 12, label: { show: true, position: 'top', }, itemStyle: { normal: { color: "rgba(248,216,226, 1)", } }, areaStyle: { //区域填充样式 normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgba(248,216,226, 0.28)' }, { offset: 1, color: 'rgba(248,216,226, 0.01)' } ], false), } }, data: noList } ] }; var startNum = 0; var endNum = 20; function zoomInterval() { if (endNum > 100) { option.dataZoom[0].start = 0; option.dataZoom[0].end = 20; startNum = 0; endNum = 20; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openSalaryInfo(name); }); } else { option.dataZoom[0].start = startNum; option.dataZoom[0].end = endNum; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openSalaryInfo(name); }); } startNum += 20; endNum += 20; }; var myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openSalaryInfo(name); }); myChart.on('mouseover', function(params) { clearInterval(myInterval); }); myChart.on('mouseout', function(params) { myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); }); } //施工人脸甄别 function getWorkerPostCardListEcharts(list,allcard) { var myChart = echarts.init(document.getElementById('WorkPhoto')); var colorList=['#afa3f5', '#00d488', '#3feed4', '#3bafff', '#f1bb4c','#aff', "rgba(250,250,250,0.5)"]; var option = { title: { subtext: '总证件\n'+allcard, x: 'center', y: '40%', textStyle: { fontSize:18, fontWeight:'normal', color: ['#333'] }, subtextStyle: { color: '#f1bb4c', fontSize: 16 }, }, grid: { bottom: 150, left: 0, right: '10%' }, legend: { show:false, orient: 'vertical', top: "middle", right: "5%", textStyle: { color: '#f2f2f2', fontSize: 25, }, icon: 'roundRect' }, series: [ // 主要展示层的 { radius: ['29%', '59%'], center: ['50%', '50%'], type: 'pie', itemStyle: { normal: { color: function(params) { return colorList[params.dataIndex] } } }, labelLine: { normal: { show: true, length: 15, length2: 100, lineStyle: { color: '#d3d3d3' }, align: 'right' }, color: "#000", emphasis: { show: true } }, label:{ normal:{ formatter: function(params){ console.log(params) var str = ''; switch(params.name){ case params.name:str = params.name+params.value+'个';break; case params.name:str = params.name+params.value+'个';break; case params.name:str = params.name+params.value+'个';break; case params.name:str = params.name+params.value+'个';break; case params.name:str = params.name+params.value+'个';break; case params.name:str = params.name+params.value+'个';break; } return str }, padding: [0, -90], height: 35, rich: { a: { width:38, height:38, lineHeight: 50, align: 'left' }, b: { width:29, height:45, lineHeight: 50, align: 'left' }, c: { width:34, height:33, lineHeight: 50, align: 'left' }, d: { width:34, height:44, lineHeight: 50, align: 'left' }, e: { width:38, height:30, lineHeight: 50, align: 'left' }, nameStyle: { fontSize: 16, color: "#555", align: 'left' }, rate: { fontSize: 20, color: "#1ab4b8", align: 'left' } } } }, data: list, }, // 边框的设置 { radius: ['54%', '52%'], center: ['50%', '50%'], type: 'pie', label: { normal: { show: false }, emphasis: { show: false } }, labelLine: { normal: { show: false }, emphasis: { show: false } }, animation: false, tooltip: { show: false }, itemStyle: { normal: { color:'rgba(250,250,250,0.5)' } }, data: [{ value: 1, }], } ] }; myChart.setOption(option); /* $.ajax({ type: "post", url: smz_web_url + 'home/getWorkerAttendanceList', data: {companyId:companyId}, dataType: "json", success: function(data) { }, error: function(XMLHttpRequest, textStatus, errorThrown) {} });*/ } //人员出入场统计 function inOutEcharts(name,inCount,outCount){ var myChart = echarts.init(document.getElementById('inOut')); var option = { legend: { top:'12%', data: ['入场','出场'], textStyle: { fontSize: 14, color: 'F1F1F3' }, }, grid: { top: '30%', left: '2%', right: '2%', bottom: '5%', containLabel: true, }, tooltip: { trigger: "axis", axisPointer: { type: 'none' }, }, xAxis: [{ type: 'category', boundaryGap: true, axisLine: { show: true, lineStyle: { color: '#0471C2' } }, axisLabel: { textStyle: { color: '#fff', fontSize: 14 }, formatter: function(value) { var len = value.length; if(len>5){ return value.substring(0, 5) + "..." ; }else{ return value; } } }, axisTick: { show: false, }, data: name, }], yAxis: [{ type: 'value', axisTick: { show: false, }, splitLine: { show: false, lineStyle: { color: 'rgba(226, 226, 226, 0.3)', width: 1 } }, axisLine: { show: true, lineStyle: { color: '#0471C2' } }, axisLabel: { textStyle: { color: '#fff', fontSize: 14 }, }, }], //滚动条 dataZoom: [{ show: false, height: 12, xAxisIndex: [0], bottom: '0%', start: 0, end: 50, zoomLock: true, //禁用缩放 handleSize: '110%', handleStyle: { color: "#d3dee5", }, textStyle: { color: "#fff" }, borderColor: "#90979c" }], series: [{ name: '入场', type: 'line', showAllSymbol: true, symbolSize: 12, label: { show: true, position: 'top', }, itemStyle: { normal: { color: "rgba(24,220,255, 1)", } }, data: inCount },{ name: '出场', type: 'line', showAllSymbol: true, symbolSize: 12, label: { show: true, position: 'top', }, itemStyle: { normal: { color: "rgba(251,184,161, 1)", } }, data: outCount } ] }; var startNum = 0; var endNum = 50; function zoomInterval() { if (endNum > 100) { option.dataZoom[0].start = 0; option.dataZoom[0].end = 50; startNum = 0; endNum = 50; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerRecordInfo(name); }); } else { option.dataZoom[0].start = startNum; option.dataZoom[0].end = endNum; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerRecordInfo(name); }); } startNum += 50; endNum += 50; }; var myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerRecordInfo(name); }); myChart.on('mouseover', function(params) { clearInterval(myInterval); }); myChart.on('mouseout', function(params) { myInterval=window.setInterval(function(){zoomInterval()}, intervalTime); }); } //年龄构造 25-35 function age1Echarts(list){ var myChart = echarts.init(document.getElementById('age1')); var option = { color: ['#cd4692', '#9658c3', '#6c6be2', '#01aebf', '#18b794'], tooltip: { trigger: 'item', formatter: "{b} : {c}({d}%)", textStyle: { fontSize: 16, }, }, series: [{ type: 'pie', clockwise: false, startAngle: 90, radius: '75%', center: ['50%', '55%'], hoverAnimation: false, roseType: 'radius', //area data: list, itemStyle: { normal:{ borderColor:'#122647', borderWidth:'5', }, }, label: { show: true, position: 'outside', formatter: '{a|{b}:{c}}', rich: { hr: { backgroundColor: 't', borderRadius: 100, width: 0, height: 10, padding: [3, 3, 0, -16], shadowColor: '#1c1b3a', shadowBlur: 1, shadowOffsetX: '0', shadowOffsetY: '2', }, a: { padding: [-35, 15, -20, 5], } } }, labelLine: { normal: { length: 10, length2: 20, lineStyle: { width: 1, } } }, }], } myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openWorkerAgeInfo(name); }); } //红黑白名单 function redBlackWhiteEcharts(redCount,blackCount,whiteCount){ var myChart = echarts.init(document.getElementById('redBlackWhite')); var myBgColor = ["red","black","white"]; var dataList = [redCount,blackCount,whiteCount]; var option = { grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: [{ type: 'category', data: ['红名单', '黑名单', '白名单', ], axisLine: { show: true, lineStyle: { color: "#063374", width: 1, type: "solid" } }, axisTick: { show: false }, axisLabel: { show: true, textStyle: { color: "#00c7ff", } }, }], yAxis: [{ type: 'value', axisLabel: { formatter: '{value}' }, axisLine: { show: false, lineStyle: { color: "#00c7ff", width: 1, type: "solid" }, }, axisTick: { show: false }, splitLine: { lineStyle: { color: "#063374", } } }], series: [{ type: 'bar', data: dataList, barWidth: 50, //柱子宽度 //barGap: 1, //柱子之间间距 itemStyle: { normal: { color: function(params) { var num=myBgColor.length; return myBgColor[params.dataIndex%num] }, opacity: 1, } } }] }; myChart.setOption(option);// 为echarts对象加载数据 if (myChart._$handlers.click) {//防止重复触发点击事件 myChart._$handlers.click.length = 0; } myChart.on('click', function(params) { var name = params.name; openRedBlackWhitePage(name); }); } //二级页面跳转 //红黑白名单 function openRedBlackWhitePage(name){ if(name === "红名单"){ var index = top.layer.open({ title: false, type: 2, content: '../../page/redBlack/workerRed.html', area: ['90%', '90%'], maxmin: false }); }else if(name === "黑名单"){ var index = top.layer.open({ title: false, type: 2, content: '../../page/redBlack/workerBlack.html', area: ['90%', '90%'], maxmin: false }); }else if(name === "白名单"){ var index = top.layer.open({ title: false, type: 2, content: '../../page/redBlack/workerWhite.html', area: ['90%', '90%'], maxmin: false }); } } // //二级页面跳转 //项目概况 function showProInfo(type){ localStorage.setItem("type", type); var index = top.layer.open({ title: false, type: 2, content: '../../page/proInfo/proInfo.html', area: ['90%', '90%'], maxmin: false }); } //人员管理 function openWorkerInfo(proName){ localStorage.setItem("proName", proName); var index = top.layer.open({ title: false, type: 2, content: '../../page/worker/person.html', area: ['90%', '90%'], maxmin: false }); } //工种统计 function openWorkerPostInfo(postName){ // localStorage.setItem("postName", postName); var index = top.layer.open({ title: false, type: 2, content: '../../page/workerPost/workerPostIfr.html', area: ['90%', '90%'], maxmin: false }); } //施工人脸甄别 function showAttendance(){ var index = top.layer.open({ title: false, type: 2, content: '../../page/attendanceInfo/attendanceInfo.html', area: ['90%', '90%'], maxmin: false }); } //人员出入场 function openWorkerRecordInfo(proName){ localStorage.setItem("proName", proName); var index = top.layer.open({ title: false, type: 2, content: '../../page/workerRecord/workerRecord.html', area: ['90%', '90%'], maxmin: false }); } //年龄结构 function openWorkerAgeInfo(name){ localStorage.setItem("type","年龄结构"); localStorage.setItem("postName",name); var index = top.layer.open({ title: false, type: 2, content: '../../page/workerPost/workerPostPeople.html', area: ['90%', '90%'], maxmin: false }); } //红名单 function showRed(){ var index = top.layer.open({ title: false, type: 2, content: '../../page/redBlack/workerRed.html', area: ['90%', '90%'], maxmin: false }); } //黑名单 function showBlack(){ var index = top.layer.open({ title: false, type: 2, content: '../../page/redBlack/workerBlack.html', area: ['90%', '90%'], maxmin: false }); } //工资册 function openSalaryInfo(proName){ localStorage.setItem("proName", proName); var index = top.layer.open({ title: false, type: 2, content: '../../page/salary/salaryInfo.html', area: ['90%', '90%'], maxmin: false }); } //合同管理 function showContract(proid,type){ console.log(proid) console.log(type) localStorage.setItem("ContractProid", proid); localStorage.setItem("ContractType", type); var index = top.layer.open({ title: false, type: 2, content: '../../page/contract/contractInfo.html', area: ['90%', '90%'], maxmin: false }); }