Skip to content

K
kwell-mes
Commit f3c7a8cc authored by 李苏's avatar 李苏 💬
Browse files
Options

改url

parent 68c26e11
Show whitespace changes
Inline Side-by-side
Showing with 2850 additions and 2565 deletions
gavel/src/main/resources/static/js/dashboard/api.js
View file @ f3c7a8cc
......@@ -172,7 +172,7 @@
});
}
/* 日排除合格率 */
function apisetRpcHglEchart(chartHgl){
function apisetRpcHglEchart(chartHgl,isRcl){
function gethgl(){
return new Promise(function(y,n){
HTTP.post("queryGpfkHgl", {}, function(result) {
......@@ -202,7 +202,11 @@
data.forEach(function(e,index){
data[index].jhrq=new Date(e.pcrq).toLocaleDateString().split('/').join('-')
})
if(isRcl=='rcl'){
setRclHglEchart(chartHgl,ye,data)
}else{
setRpcHglEchart(chartHgl,ye,data)
}
} else {
console.log("请求失败")
}
......
gavel/src/main/resources/static/js/dashboard/echarts.js
View file @ f3c7a8cc
$(function () {
$(function() {
/*ceshis();*/
// ceshis1();
......@@ -46,7 +46,9 @@ $(function () {
value: 6
}
];
var color = ["#8d7fec", "#5085f2", "#e75fc3", "#f87be2", "#f2719a", "#fca4bb", "#f59a8f", "#fdb301", "#57e7ec", "#cf9ef1"]
var color = ["#8d7fec", "#5085f2", "#e75fc3", "#f87be2", "#f2719a", "#fca4bb", "#f59a8f", "#fdb301",
"#57e7ec", "#cf9ef1"
]
var xdata = ['天猫', "京东", "苏宁易购", "拼多多", '国美', '亚马逊', '唯品会', '唯品会'];
......@@ -159,7 +161,7 @@ $(function () {
myChart.currentIndex = -1;
setInterval(function () {
setInterval(function() {
var dataLen = option.series[0].data.length;
// 取消之前高亮的图形
myChart.dispatchAction({
......@@ -178,10 +180,11 @@ $(function () {
// 使用刚指定的配置项和数据显示图表。
/*myChart.setOption(option);*/
window.addEventListener("resize",function(){
window.addEventListener("resize", function() {
myChart.resize();
});
}
function ceshis2() {
var myChart = echarts.init(document.getElementById('chart3'));
......@@ -225,7 +228,9 @@ $(function () {
"type": "pie",
"center": ["50%", "40%"],
"radius": ["20%", "43%"],
"color": ["#FEE449", "#00FFFF", "#00FFA8", "#9F17FF", "#FFE400", "#F76F01", "#01A4F7", "#FE2C8A"],
"color": ["#FEE449", "#00FFFF", "#00FFA8", "#9F17FF", "#FFE400", "#F76F01",
"#01A4F7", "#FE2C8A"
],
"startAngle": 135,
"labelLine": {
"normal": {
......@@ -381,7 +386,7 @@ $(function () {
myChart.currentIndex = -1;
//myChart.setOption(option);
//console.log(option.series[0].data[0]);
setInterval(function () {
setInterval(function() {
var dataLen = option.series[0].data.length;
// 取消之前高亮的图形
myChart.dispatchAction({
......@@ -398,10 +403,11 @@ $(function () {
});
}, 1000);
window.addEventListener("resize",function(){
window.addEventListener("resize", function() {
myChart.resize();
});
}
function ceshis3() {
var myChart = echarts.init(document.getElementById('chart4'));
......@@ -422,7 +428,9 @@ $(function () {
for (var i = 0; i < params.length; i++) {
// 获取每个系列对应的颜色值
html += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:' + params[i].color + ';"></span>';
html +=
'<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:' +
params[i].color + ';"></span>';
// 通过判断指定系列增加 % 符号
if (option.series[params[i].seriesIndex].type == "line") {
......@@ -553,10 +561,11 @@ $(function () {
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
window.addEventListener("resize",function(){
window.addEventListener("resize", function() {
myChart.resize();
});
}
function ceshis4() {
var myChart = echarts.init(document.getElementById('chart5'));
......@@ -750,7 +759,8 @@ $(function () {
"position": "top",
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"rich": {
......@@ -810,7 +820,8 @@ $(function () {
"position": "top",
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"rich": {
......@@ -870,7 +881,8 @@ $(function () {
"position": "top",
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"rich": {
......@@ -929,7 +941,8 @@ $(function () {
"show": true,
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"position": "top",
......@@ -990,7 +1003,8 @@ $(function () {
"position": "top",
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"rich": {
......@@ -1050,7 +1064,8 @@ $(function () {
"position": "top",
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"rich": {
......@@ -1110,7 +1125,8 @@ $(function () {
"position": "top",
formatter: function(params) {
var index = params.dataIndex;
var str = "{a|" + params.value + "}\n{c|" + params.value + "个}";
var str = "{a|" + params.value + "}\n{c|" + params.value +
"个}";
return str;
},
"rich": {
......@@ -1170,7 +1186,7 @@ $(function () {
}
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
window.addEventListener("resize",function(){
window.addEventListener("resize", function() {
myChart.resize();
});
}
......@@ -1181,31 +1197,31 @@ $(function () {
var uploadedDataURL = "./js/data-1528971808162-BkOXf61WX.json";
//console.log(uploadedDataURL);
// echarts.extendsMap = function(id, opt) {
// // 实例
// var cityMap = {
// "郑州市": zhengzhou,
// "开封市": kaifeng,
// "洛阳市": luoyang,
// "平顶山市": pingdingshan,
// "安阳市": anyang,
// "鹤壁市": hebi,
// "新乡市": xinxiang,
// "焦作市": jiaozuo,
// "濮阳市": puyang,
// "漯河市": luohe,
// "三门峡市": sanmenxia,
// "南阳市": nanyang,
// "商丘市": shangqiu,
// "信阳市": xinyang,
// "周口市": zhoukou,
// "许昌市": xuchang,
// "驻马店市": zhumadian
// };
// echarts.extendsMap = function(id, opt) {
// // 实例
// var cityMap = {
// "郑州市": zhengzhou,
// "开封市": kaifeng,
// "洛阳市": luoyang,
// "平顶山市": pingdingshan,
// "安阳市": anyang,
// "鹤壁市": hebi,
// "新乡市": xinxiang,
// "焦作市": jiaozuo,
// "濮阳市": puyang,
// "漯河市": luohe,
// "三门峡市": sanmenxia,
// "南阳市": nanyang,
// "商丘市": shangqiu,
// "信阳市": xinyang,
// "周口市": zhoukou,
// "许昌市": xuchang,
// "驻马店市": zhumadian
// };
// }
// }
var geoGpsMap = {
'1': [116.4071, 39.9046],
'2': [125.8154, 44.2584],
......@@ -1456,9 +1472,15 @@ $(function () {
var colors = [
["#1DE9B6", "#1DE9B6", "#FFDB5C", "#FFDB5C", "#04B9FF", "#04B9FF"],
["#1DE9B6", "#F46E36", "#04B9FF", "#5DBD32", "#FFC809", "#FB95D5", "#BDA29A", "#6E7074", "#546570", "#C4CCD3"],
["#37A2DA", "#67E0E3", "#32C5E9", "#9FE6B8", "#FFDB5C", "#FF9F7F", "#FB7293", "#E062AE", "#E690D1", "#E7BCF3", "#9D96F5", "#8378EA", "#8378EA"],
["#DD6B66", "#759AA0", "#E69D87", "#8DC1A9", "#EA7E53", "#EEDD78", "#73A373", "#73B9BC", "#7289AB", "#91CA8C", "#F49F42"],
["#1DE9B6", "#F46E36", "#04B9FF", "#5DBD32", "#FFC809", "#FB95D5", "#BDA29A", "#6E7074",
"#546570", "#C4CCD3"
],
["#37A2DA", "#67E0E3", "#32C5E9", "#9FE6B8", "#FFDB5C", "#FF9F7F", "#FB7293", "#E062AE",
"#E690D1", "#E7BCF3", "#9D96F5", "#8378EA", "#8378EA"
],
["#DD6B66", "#759AA0", "#E69D87", "#8DC1A9", "#EA7E53", "#EEDD78", "#73A373", "#73B9BC",
"#7289AB", "#91CA8C", "#F49F42"
],
];
var colorIndex = 0;
$(function() {
......@@ -1920,7 +1942,7 @@ $(function () {
// 使用刚指定的配置项和数据显示图表。
//myChart.setOption(option);
window.addEventListener("resize",function(){
window.addEventListener("resize", function() {
myChart.resize();
});
......@@ -1930,7 +1952,7 @@ $(function () {
var myChart = echarts.init(document.getElementById('chart_1'));
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
window.addEventListener("resize",function(){
window.addEventListener("resize", function() {
myChart.resize();
});
}
......@@ -1938,17 +1960,85 @@ $(function () {
});
/* oa考勤图标 */
function oaechart(chart) {
option = {
color: ['#7FFF00', 'red', '#666'],
title: {
text: '',
left: 'center'
},
tooltip: {
trigger: 'item'
},
grid: {
top: "10%",
left: "5%",
bottom: "0%",
right: "10%",
containLabel: true,
},
// legend: {
// data: ['出勤', '缺勤', '休假'],
// orient: 'vertical', //垂直显示
// y: 'top', //延Y轴居中
// x: 'left', //居右显示
// textStyle: { //图例文字的样式
// color: '#fff',
// fontSize: 12
// }
// },
series: [{
name: '考勤',
type: 'pie',
radius: '60%',
data: [{
value: 30,
name: '出勤'
},
{
value: 10,
name: '缺勤'
},
{
value: 12,
name: '休假'
},
],
itemStyle: {
normal: {
label: {
show: true,
// formatter: '{b} : {c} ({d}%)'
formatter: '{b}:({d}%)'
},
labelLine: {
show: true
}
}
},
}
]
};
chart.setOption(option, true);
}
/*时段产量图表*/
function setTimeProductionEchart(chart,apidata) {
if(apidata){
var list=[]
apidata.xseriesList.forEach(function(e,index){
list[index]={date:e,value:apidata.timeperiodMount[index]}
function setTimeProductionEchart(chart, apidata) {
if (apidata) {
var list = []
apidata.xseriesList.forEach(function(e, index) {
list[index] = {
date: e,
value: apidata.timeperiodMount[index]
}
})
var data=[{name: "产量",list:list}]
}else{
var data = [
{
var data = [{
name: "产量",
list: list
}]
} else {
var data = [{
name: "产量",
list: [{
date: "周一",
......@@ -1979,16 +2069,15 @@ function setTimeProductionEchart(chart,apidata) {
value: 14
}
]
}];
}
];
}
var dateList=[];
var dateList = [];
var yData1 = [];
data[0].list.forEach(function(item,index){
data[0].list.forEach(function(item, index) {
dateList.push(data[0].list[index].date);
yData1.push(data[0].list[index].value);
});
var opsChart={
var opsChart = {
color: ['#e08f68'],
tooltip: {
......@@ -1998,7 +2087,8 @@ function setTimeProductionEchart(chart,apidata) {
},
formatter: function(params) {
var tiplabel = params[0].name + '<br/>' +
'<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' + params[0].color.colorStops[0].color + '"></span>' +
'<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
params[0].color.colorStops[0].color + '"></span>' +
params[0].seriesName + ':' + params[0].value;
return tiplabel;
}
......@@ -2012,7 +2102,7 @@ function setTimeProductionEchart(chart,apidata) {
}
},
grid: {
top:"10%",
top: "10%",
left: "5%",
bottom: "0%",
right: "5%",
......@@ -2031,14 +2121,14 @@ function setTimeProductionEchart(chart,apidata) {
fontSize: 12
},
color: 'rgba(255,255,255,0.6)',
formatter:function(value){
formatter: function(value) {
var str = "";
var num = 6; //每行显示字数
var valLength = value.length; //该项x轴字数
var rowNum = Math.ceil(valLength / num); // 行数
if(rowNum > 1) {
for(var i = 0; i < rowNum; i++) {
if (rowNum > 1) {
for (var i = 0; i < rowNum; i++) {
var temp = "";
var start = i * num;
var end = start + num;
......@@ -2064,8 +2154,8 @@ function setTimeProductionEchart(chart,apidata) {
},
yAxis: [{
type: 'value',
min:0.0,
max:50.0,
min: 0.0,
max: 50.0,
splitLine: {
show: false,
lineStyle: {
......@@ -2090,8 +2180,7 @@ function setTimeProductionEchart(chart,apidata) {
color: 'rgba(255,255,255,0.6)'
}
}],
series: [
{
series: [{
name: data[0].name,
yAxisIndex: 0,
//barMinHeight:5,
......@@ -2117,34 +2206,33 @@ function setTimeProductionEchart(chart,apidata) {
},
type: 'bar',
data: yData1
}]
}
]
}
chart.setOption(opsChart,true);
chart.setOption(opsChart, true);
}
/*日排产达成数据*/
function setDailyDataEchart(chart,apidata) {
let datelist=[]
let jslist=[]
let wglist=[]
if(apidata){
apidata.forEach(function(e,index){
datelist[index]=e.jhrq
function setDailyDataEchart(chart, apidata) {
let datelist = []
let jslist = []
let wglist = []
if (apidata) {
apidata.forEach(function(e, index) {
datelist[index] = e.jhrq
})
}
if(apidata){
apidata.forEach(function(e,index){
jslist[index]=e.jhsl
if (apidata) {
apidata.forEach(function(e, index) {
jslist[index] = e.jhsl
})
}
if(apidata){
apidata.forEach(function(e,index){
wglist[index]=e.wgsl
if (apidata) {
apidata.forEach(function(e, index) {
wglist[index] = e.wgsl
})
}
var ops= {
color:["#67c23a","#409eff"],
var ops = {
color: ["#67c23a", "#409eff"],
tooltip: {
trigger: 'axis',
axisPointer: {
......@@ -2153,70 +2241,66 @@ function setDailyDataEchart(chart,apidata) {
},
legend: {
align: 'left',
right:0,
right: 0,
// orient:"vertical",
x : 'right', //居左显示
x: 'right', //居左显示
y: 'left', //延Y轴
textStyle:{
color:'white'
textStyle: {
color: 'white'
}
},
grid: {
top:'20%',
top: '20%',
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
xAxis: [{
type: 'category',
data: datelist||['1/01', '1/02', '1/03', '1/04', '1/05', '1/06', '1/07'],
axisTick:{
show:true,
lineStyle:{
color:"white"
data: datelist || ['1/01', '1/02', '1/03', '1/04', '1/05', '1/06', '1/07'],
axisTick: {
show: true,
lineStyle: {
color: "white"
}
},
axisLine:{
show:true,
lineStyle:{
color:"white"
axisLine: {
show: true,
lineStyle: {
color: "white"
}
},
axisLabel:{
show:true,
color:'white'
}
axisLabel: {
show: true,
color: 'white'
}
],
yAxis:
{
}],
yAxis: {
type: 'value',
splitLine: {
show: false
},
axisTick:{
show:false
axisTick: {
show: false
},
axisLine:{
show:false
axisLine: {
show: false
},
axisLabel:{
show:true,
color:'white'
axisLabel: {
show: true,
color: 'white'
}
},
series: [
{
series: [{
name: '计划',
type: 'bar',
stack: 'Ad',
emphasis: {
focus: 'series'
},
data: jslist||[120, 132, 101, 134, 90, 230, 210]
data: jslist || [120, 132, 101, 134, 90, 230, 210]
},
{
name: '完工',
......@@ -2225,17 +2309,17 @@ function setDailyDataEchart(chart,apidata) {
emphasis: {
focus: 'series'
},
data: wglist||[220, 182, 191, 234, 290, 330, 310]
data: wglist || [220, 182, 191, 234, 290, 330, 310]
}
]
};
chart.setOption(ops,true);
chart.setOption(ops, true);
}
/* 手环展示 */
function setchartJdshCirle(chartJdshCirle,apidata){
function setchartJdshCirle(chartJdshCirle, apidata) {
var option = {
color:['greenyellow','red','skyblue'],
color: ['greenyellow', 'red', 'skyblue'],
tooltip: {
trigger: 'item'
},
......@@ -2243,8 +2327,7 @@ function setDailyDataEchart(chart,apidata) {
top: '5%',
left: 'center'
},
series: [
{
series: [{
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
......@@ -2267,31 +2350,35 @@ function setDailyDataEchart(chart,apidata) {
labelLine: {
show: false
},
data: [
{ value: apidata.g||0},
{ value: apidata.r||0},
{ value: apidata.s||0},
]
}
data: [{
value: apidata.g || 0
},
{
value: apidata.r || 0
},
{
value: apidata.s || 0
},
]
}]
};
chartJdshCirle.setOption(option);
}
}
/*合格率*/
function setHglEchart(chart,apidata) {
let datelist=[]
let hgllist=[]
if(apidata){
apidata.forEach(function(e){
function setHglEchart(chart, apidata) {
let datelist = []
let hgllist = []
if (apidata) {
apidata.forEach(function(e) {
datelist.push(e.fkrq)
hgllist.push(e.hgl)
})
}
var ops= {
color:["#409eff"],
var ops = {
color: ["#409eff"],
grid: {
top:"10%",
top: "10%",
left: "5%",
bottom: "5%",
right: "5%",
......@@ -2299,22 +2386,22 @@ function setHglEchart(chart,apidata) {
},
xAxis: {
type: 'category',
data:datelist|| ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
axisTick:{
show:true,
lineStyle:{
color:"white"
data: datelist || ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
axisTick: {
show: true,
lineStyle: {
color: "white"
}
},
axisLine:{
show:true,
lineStyle:{
color:"white"
axisLine: {
show: true,
lineStyle: {
color: "white"
}
},
axisLabel:{
show:true,
color:'white'
axisLabel: {
show: true,
color: 'white'
}
},
yAxis: {
......@@ -2322,67 +2409,70 @@ function setHglEchart(chart,apidata) {
splitLine: {
show: false
},
axisTick:{
show:false
axisTick: {
show: false
},
axisLine:{
show:false
axisLine: {
show: false
},
axisLabel:{
show:true,
color:'white'
axisLabel: {
show: true,
color: 'white'
}
},
series: [
{
data:hgllist|| [150, 230, 224, 218, 135, 147, 260],
series: [{
data: hgllist || [150, 230, 224, 218, 135, 147, 260],
type: 'line',
itemStyle : { normal: {label : {show: true}}}
itemStyle: {
normal: {
label: {
show: true
}
]
}
}
}]
};
chart.setOption(ops,true);
chart.setOption(ops, true);
}
function setPieDailyChart(chart,cerpent,pdata) {
let apidata={}
apidata.jhsl=0
apidata.wgsl=0
if(pdata){
apidata=pdata
function setPieDailyChart(chart, cerpent, pdata) {
let apidata = {}
apidata.jhsl = 0
apidata.wgsl = 0
if (pdata) {
apidata = pdata
}
var ops= {
color:["#A2E9FF","#409eff"],
var ops = {
color: ["#A2E9FF", "#409eff"],
tooltip: {
trigger: 'item'
},
legend: {
top: '5%',
left: 'center',
show:false
show: false
},
series: [
{
series: [{
name: '完成率',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
hoverAnimation:false,
silent:true,
hoverAnimation: false,
silent: true,
label: {
normal: {
show: true,
position: 'center',
formatter: function(data){ // 设置圆饼图中间文字排版
return "完工率\n"+(cerpent?(cerpent+"%"):"")
formatter: function(data) { // 设置圆饼图中间文字排版
return "完工率\n" + (cerpent ? (cerpent + "%") : "")
},
},
emphasis: {
disabled:true,
disabled: true,
show: false, //文字至于中间时，这里需为true
textStyle: { //设置文字样式
fontSize: '12',
color:"#333"
color: "#333"
}
}
},
......@@ -2391,27 +2481,31 @@ function setPieDailyChart(chart,cerpent,pdata) {
show: false
}
},
data: [
{ value: (apidata.jhsl-apidata.wgsl)||0, name: '未完工'},
{ value: apidata.wgsl||0, name: '完工' },
]
}
data: [{
value: (apidata.jhsl - apidata.wgsl) || 0,
name: '未完工'
},
{
value: apidata.wgsl || 0,
name: '完工'
},
]
}]
};
chart.setOption(ops,true);
chart.setOption(ops, true);
}
function setRpcHglEchart(chart,apidata1,apidata2) {
let datelist=[]
let hgllist=[]
let jslist=[]
let wglist=[]
if(apidata1&&apidata2){
apidata1.forEach(function(e){
function setRpcHglEchart(chart, apidata1, apidata2) {
let datelist = []
let hgllist = []
let jslist = []
let wglist = []
if (apidata1 && apidata2) {
apidata1.forEach(function(e) {
hgllist.push(e.hgl)
})
apidata2.forEach(function(e){
apidata2.forEach(function(e) {
console.log(e.jhrq)
datelist.push(e.jhrq.slice(5))
jslist.push(e.jhsl)
......@@ -2419,7 +2513,7 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
})
}
var ops = {
color:["#409eff","#55ff7f","#ffd03e"],
color: ["#409eff", "#55ff7f", "#ffd03e"],
// tooltip: {
// trigger: 'axis',
// axisPointer: {
......@@ -2430,9 +2524,9 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
// }
// },
legend: {
data: ['计划', '完工','合格率'],
textStyle:{
color:'white'
data: ['计划', '完工', '合格率'],
textStyle: {
color: 'white'
}
},
grid: {
......@@ -2441,58 +2535,55 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
bottom: '3%',
containLabel: true
},
xAxis: [
{
xAxis: [{
type: 'category',
data: datelist||['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
data: datelist || ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
axisPointer: {
type: 'shadow'
},
axisTick:{
show:true,
lineStyle:{
color:"white"
axisTick: {
show: true,
lineStyle: {
color: "white"
}
},
axisLine:{
show:true,
lineStyle:{
color:"white"
axisLine: {
show: true,
lineStyle: {
color: "white"
}
},
axisLabel:{
show:true,
color:'white'
}
axisLabel: {
show: true,
color: 'white'
}
],
yAxis: [
{
}],
yAxis: [{
type: 'value',
name: '计划',
nameTextStyle:{
color:"white"
nameTextStyle: {
color: "white"
},
splitLine: {
show: false,
},
axisTick:{
show:true,
lineStyle:{
color:'white',
axisTick: {
show: true,
lineStyle: {
color: 'white',
}
},
axisLine:{
show:true,
lineStyle:{
color:'white',
axisLine: {
show: true,
lineStyle: {
color: 'white',
}
},
axisLabel:{
show:true,
color:'white',
axisLabel: {
show: true,
color: 'white',
formatter: '{value}'
}
},
......@@ -2502,48 +2593,47 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
min: 0,
max: 100,
interval: 20,
nameTextStyle:{
color:"white"
nameTextStyle: {
color: "white"
},
splitLine: {
show: false,
},
axisTick:{
show:true,
lineStyle:{
color:'white',
axisTick: {
show: true,
lineStyle: {
color: 'white',
}
},
axisLine:{
show:true,
lineStyle:{
color:'white',
axisLine: {
show: true,
lineStyle: {
color: 'white',
}
},
axisLabel:{
show:true,
color:'white',
axisLabel: {
show: true,
color: 'white',
formatter: '{value} %'
}
}
],
series: [
{
series: [{
name: '计划',
type: 'bar',
data: jslist||[
data: jslist || [
2.6, 5.9, 9.0, 26.4, 28.7,
],
barWidth : 15,
itemStyle:{
normal:{
label:{
show:true,
position:"top",
textStyle:{
color:"white",
barWidth: 15,
itemStyle: {
normal: {
label: {
show: true,
position: "top",
textStyle: {
color: "white",
}
}
......@@ -2554,17 +2644,17 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
{
name: '完工',
type: 'bar',
data: wglist||[
data: wglist || [
2.6, 5.9, 9.0, 26.4, 28.7,
],
barWidth : 15,
itemStyle:{
normal:{
label:{
show:true,
position:"top",
textStyle:{
color:"white",
barWidth: 15,
itemStyle: {
normal: {
label: {
show: true,
position: "top",
textStyle: {
color: "white",
}
}
......@@ -2576,14 +2666,14 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
name: '合格率',
type: 'line',
yAxisIndex: 0,
data: hgllist||[20,30,90,30,29],
itemStyle:{
normal:{
label:{
show:true,
position:"top",
textStyle:{
color:"orange",
data: hgllist || [20, 30, 90, 30, 29],
itemStyle: {
normal: {
label: {
show: true,
position: "top",
textStyle: {
color: "orange",
}
}
......@@ -2593,10 +2683,150 @@ function setRpcHglEchart(chart,apidata1,apidata2) {
}
]
};
chart.setOption(ops,true);
chart.setOption(ops, true);
}
function setRclHglEchart(chart, apidata1, apidata2) {
let datelist = []
let hgllist = []
let jslist = []
let wglist = []
if (apidata1 && apidata2) {
apidata1.forEach(function(e) {
hgllist.push(e.hgl)
})
apidata2.forEach(function(e) {
console.log(e.jhrq)
datelist.push(e.jhrq.slice(5))
jslist.push(e.jhsl)
wglist.push(e.wgsl)
})
}
var ops = {
color: ["#409eff", "#55ff7f", "#ffd03e"],
// tooltip: {
// trigger: 'axis',
// axisPointer: {
// type: 'cross',
// crossStyle: {
// color: '#999'
// }
// }
// },
legend: {
data: ['日产量', '合格率'],
textStyle: {
color: 'white'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [{
type: 'category',
data: datelist || ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
axisPointer: {
type: 'shadow'
},
axisTick: {
show: true,
lineStyle: {
color: "white"
}
},
axisLine: {
show: true,
lineStyle: {
color: "white"
}
},
axisLabel: {
show: true,
color: 'white'
}
}],
yAxis: [{
type: 'value',
name: '合格率',
min: 0,
max: 100,
interval: 20,
nameTextStyle: {
color: "white"
},
splitLine: {
show: false,
},
axisTick: {
show: true,
lineStyle: {
color: 'white',
}
},
axisLine: {
show: true,
lineStyle: {
color: 'white',
}
},
axisLabel: {
show: true,
color: 'white',
formatter: '{value} %'
}
}],
series: [{
name: '日产量',
type: 'bar',
data: wglist || [
2.6, 5.9, 9.0, 26.4, 28.7,
],
barWidth: 30,
itemStyle: {
normal: {
label: {
show: true,
position: "top",
textStyle: {
color: "white",
}
}
}
}
},
{
name: '合格率',
type: 'line',
yAxisIndex: 0,
data: hgllist || [20, 30, 90, 30, 29],
itemStyle: {
normal: {
label: {
show: true,
position: "top",
textStyle: {
color: "orange",
}
}
}
}
}
]
};
chart.setOption(ops, true);
}
// function setPieYChart(chart) {
// var ops= {
// tooltip: {
......
gavel/src/main/resources/templates/views/kmes/dashboard/first.html
View file @ f3c7a8cc
......@@ -43,13 +43,13 @@
<div class="center-left fl">
<div class="left-top rightTop border">
<!--<h1 id="ceshi">数据可视化</h1>-->
<div class="title">日产量</div>
<div class="title">OA考勤</div>
<div class="bottom-b">
<div id="chartSdcl" class="allnav"></div>
</div>
</div>
<div class="left-cen rightTop border">
<div class="title">日排产&合格率</div>
<div class="title">日产量&合格率</div>
<div class="bottom-b">
<div id="chartRpcdcsj" class="allnav"></div>
</div>
......@@ -104,7 +104,7 @@
</div>
<div class="center-cen fl">
<div class="cen-top rightTop border">
<video width="100%" height="100%" controls id="firstVideo" autoplay="autoplay" muted loop="loop">
<video width="100%" height="100%" controls id="firstVideo" muted autoplay="autoplay" loop="loop">
</video>
</div>
<div class="cen-bottom rightTop border">
......@@ -293,7 +293,13 @@
</div>
</div>
<div class="right-bottom rightTop border" style="height: 6.8rem;">
<div class="right-bottom rightTop border" style="height: 3.2rem;margin-bottom: 0.2rem;">
<div class="title">工艺流程图</div>
<div class="chat" style="height: calc(100% - 0.4rem);">
<!-- <canvas id="gylct" style="width: 100%;height: 100%"></canvas> -->
</div>
</div>
<div class="right-bottom rightTop border" style="height: 3.2rem;margin-top: 0.4rem;">
<div class="title">工艺流程图</div>
<div class="chat" style="height: calc(100% - 0.4rem);">
<canvas id="gylct" style="width: 100%;height: 100%"></canvas>
......@@ -336,7 +342,8 @@
var chartRjh=echarts.init(document.getElementById("chartRjh"));
var chartYjh=echarts.init(document.getElementById("chartYjh"));
var chartJdshCirle=echarts.init(document.getElementById("chartJdshCirle"));
setTimeProductionEchart(myChartSdcl); /*时段产量*/
oaechart(myChartSdcl); /*时段产量*/
setDailyDataEchart(chartRpcdcsj); /*日排产达成数据*/
// setHglEchart(chartHgl);/*合格率*/
setPieDailyChart(chartRjh,80);/*日计划*/
......@@ -355,8 +362,8 @@
}
/* 调用 */
function getAlldata(){
apisetRpcHglEchart(chartRpcdcsj)
apisetTimeProductionEchart(myChartSdcl)
apisetRpcHglEchart(chartRpcdcsj,'rcl')
// apisetTimeProductionEchart(myChartSdcl)
// apisetDailyDataEchart(chartRpcdcsj)
apisetPieDailyChart(chartRjh)
apisetPieDailyCharty(chartYjh)
......
gavel/src/main/resources/templates/views/kmes/gphy/index.html
View file @ f3c7a8cc
......@@ -3,6 +3,9 @@
<script src="js/gethash.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="css/zpfk.css"/>
<style type="text/css">
video{
object-fit:cover!important;
}
.errdialog{
min-width:35%;
/* width: 35%; */
......@@ -47,6 +50,9 @@
/* 通用代码 */
/* 通用pdf参数 */
const pdfUr="kmes/gpfk/queryPdfByWoidAndZpgx"
var urlo="kmes/gpfkfj/queryFjBybzgx/"+window.bzlx+"/O"
var urlt="kmes/gpfkfj/queryFjBybzgx/"+window.bzlx+"/T"
var urlm="kmes/gpfkfj/queryFjBybzgx/"+window.bzlx+"/M"
/* 大屏内部弹框 */
function screenAlert(dom,msg,timeNum){
let getdom=$(dom)
......@@ -205,9 +211,11 @@
if(that.sivpdf){
clearInterval(that.sivpdf)
}
/*
老pdf禁用
pdfshow(that.pdfurl, that.pdfdom, 10000).then(e => {
that.sivpdf = e
})
}) */
}
}
/* 初始化表格 */
......@@ -271,7 +279,7 @@
</ul>
</div>
<!-- 左侧信息条 -->
<div class="left">
<div class="left" style="width: 30%;">
<!-- 左上信息表 -->
<div class="cbinfor">
<div class="cpif">
......@@ -320,9 +328,20 @@
</div>
</div>
<!-- 右侧信息pdf -->
<div class="right">
<div class="right" style="width: 45%;">
<canvas id="kwrkb01pdf" class="rightPdf"></canvas>
</div>
<!-- new右侧 -->
<div class="right" style="width: 25%;">
<div style="height: 50%;overflow: hidden;">
<video width="100%" height="100%" :src="urlm" controls muted autoplay="autoplay" loop="loop">
</video>
</div>
<div ref="scrollmain" style="height: 50%;overflow: auto;border-bottom: 1px solid #EEEEEE;">
<canvas id="kwrkb01rpdf" ref="scroll" style="width: 100%;height: 160%;" ></canvas>
</div>
</div>
</div>
<!-- div2 -->
<div id="kwrkb02" style="display: none;">
......@@ -471,6 +490,7 @@
this.initpage()
dbenlarge('kwrkb01', 1, this.initpage)
$(this.el).dblclick()
this.scroll()
this.gettime()
this.isFocus()
this.appdestory()
......@@ -478,10 +498,13 @@
destroyed() {
clearInterval(this.sivdestory)
clearInterval(this.sivpdf)
clearInterval(this.sivrpdf)
clearInterval(this.sivtimer)
clearInterval(this.sivscroll)
},
data: function() {
return {
urlm:urlm,
fksl:0,
username:localStorage.getItem("username"),
okOrng:"",
......@@ -500,9 +523,30 @@
sivtimer: null, //时间计数器
sivpdf: null,
sivdestory: null,
sivscroll:null,
sivrpdf:null
}
},
methods: {
scroll(){
console.log(urlo)
/* test */
pdfshow(urlo,'kwrkb01pdf', 10000).then(e => {
that.sivpdf = e
})
/* test */
pdfshow(urlt,'kwrkb01rpdf', 10000).then(e => {
that.sivrpdf = e
})
const mainData=this.$refs.scrollmain
const divData =this.$refs.scroll
this.sivscroll=setInterval(() => {
mainData.scrollTop += 1
if (mainData.clientHeight + mainData.scrollTop+10 > mainData.scrollHeight) {
mainData.scrollTop = 0
}
}, 100)
},
// 扫码接口
apiscanxlh(){
let that=this
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment