|
@@ -3,13 +3,20 @@
|
|
|
data: {
|
|
|
dom: Object,
|
|
|
myChart: Object,
|
|
|
- option: Object,
|
|
|
+ option_1: Object,
|
|
|
+ option_2: Object,
|
|
|
|
|
|
- oees: [],
|
|
|
+ oees_1: [],
|
|
|
+ oees_2: [],
|
|
|
+ mode: 1,//1为正常,2为chamber汇总
|
|
|
outputInfo: '',
|
|
|
outputs: [],
|
|
|
+ ChamberList: [],
|
|
|
+ CheckedChamber: [],
|
|
|
|
|
|
zTreeObj: Object,
|
|
|
+ MutiSelectzTreeObj: Object
|
|
|
+
|
|
|
},
|
|
|
mounted() {
|
|
|
this.init()
|
|
@@ -17,13 +24,16 @@
|
|
|
},
|
|
|
methods: {
|
|
|
init() {
|
|
|
+
|
|
|
+ $("#devicechoose").hide();
|
|
|
+ $("#methodchoose").hide();
|
|
|
this.outputs = [
|
|
|
{
|
|
|
|
|
|
}
|
|
|
];
|
|
|
|
|
|
- $(".form-control").datepicker({
|
|
|
+ $(".date").datepicker({
|
|
|
format: 'yyyy-mm-dd',
|
|
|
language: 'zh-CN',
|
|
|
autoclose: true,
|
|
@@ -34,12 +44,15 @@
|
|
|
return false;
|
|
|
});
|
|
|
|
|
|
+ //zTreeObj = $.fn.zTree.init($("#treeDemo"), settings, res); //初始化树
|
|
|
+ //zTreeObj.expandAll(true); //true 节点全部展开、false节点收缩
|
|
|
+
|
|
|
this.dom = document.getElementById('container1');
|
|
|
this.myChart = echarts.init(this.dom, 'vintage', {
|
|
|
renderer: 'canvas',
|
|
|
useDirtyRect: false
|
|
|
});
|
|
|
- this.option = {
|
|
|
+ this.option_1 = {
|
|
|
grid: {
|
|
|
left: '4%',
|
|
|
right: '10%',
|
|
@@ -70,7 +83,7 @@
|
|
|
borderColor: "white",
|
|
|
},
|
|
|
},
|
|
|
- color: ['#5b9bd5', '#ed7d31', '#a5a5a5','#008080', '#546fc6'],
|
|
|
+ color: ['#5b9bd5', '#ed7d31', '#a5a5a5', '#008080', '#546fc6'],
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
data: [],
|
|
@@ -200,87 +213,474 @@
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
- this.myChart.on('click', (params) => this.getOutputs(params));
|
|
|
- if (this.option && typeof option === 'object') {
|
|
|
- this.myChart.setOption(this.option);
|
|
|
+ this.option_2 = {
|
|
|
+ grid: {
|
|
|
+ left: '4%',
|
|
|
+ right: '10%',
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'axis',
|
|
|
+ position: function (point, params, dom, rect, size) {
|
|
|
+ // 当前鼠标位置
|
|
|
+ var pointX = point[0];
|
|
|
+ var pointY = point[1];
|
|
|
+ return [pointX + 20, pointY + 20];
|
|
|
+ },
|
|
|
+ axisPointer: {
|
|
|
+ type: 'cross',
|
|
|
+ crossStyle: {
|
|
|
+ color: '#999'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ formatter: params => {
|
|
|
+ // 获取xAxis data中的数据
|
|
|
+ let dataStr = `<div><p style="font-weight:bold;margin:0 8px 15px;">${params[0].name}</p></div>`
|
|
|
+ var num = 0;
|
|
|
+ params.forEach(item => {
|
|
|
+ var str = "";
|
|
|
+ if (item.seriesName != "平均稼动率") {
|
|
|
+ str = this.CheckedChamber[parseInt(num / 3)].name + " ";
|
|
|
+ }
|
|
|
+ dataStr += `<div>
|
|
|
+ <div style="margin: 0 8px;">
|
|
|
+ <span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${item.color};"></span>
|
|
|
+ <span>${str + item.seriesName}</span >
|
|
|
+ <span style="float:right;color:#000000;margin-left:20px;">${item.data}</span>
|
|
|
+ </div></div>`;
|
|
|
+ num++;
|
|
|
+ })
|
|
|
+ return dataStr
|
|
|
+ }
|
|
|
+ },
|
|
|
+ toolbox: {
|
|
|
+ right: '10%',
|
|
|
+ feature: {
|
|
|
+ dataZoom: { yAxisIndex: 'none' },
|
|
|
+ mySaveAsExcel: {
|
|
|
+ show: true,
|
|
|
+ title: 'save excel',
|
|
|
+ icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
|
|
|
+ onclick: () => {
|
|
|
+ this.exportExcelTemplate();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ iconStyle: {
|
|
|
+ borderColor: "white",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ color: ['#5b9bd5', '#ed7d31', '#a5a5a5', '#008080', '#546fc6'],
|
|
|
+ xAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: [],
|
|
|
+ axisLabel: {
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 14
|
|
|
+ }
|
|
|
+ },
|
|
|
+ yAxis: [
|
|
|
+ {
|
|
|
+ type: 'value',
|
|
|
+ max: 100,
|
|
|
+ axisLabel: {
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 14,
|
|
|
+ formatter: '{value} %'
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: true, // 是否显示轴线
|
|
|
+ lineStyle: {
|
|
|
+ color: '#e0e6f1', // 刻度线的颜色
|
|
|
+ width: 1, // 刻度线的宽度
|
|
|
+ type: 'dashed' // 刻度线的类型
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'value',
|
|
|
+ //max: 8000,
|
|
|
+ axisLabel: {
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 14,
|
|
|
+ formatter: '{value} %'
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: false, // 是否显示轴线
|
|
|
+ lineStyle: {
|
|
|
+ color: '#e0e6f1', // 刻度线的颜色
|
|
|
+ width: 1, // 刻度线的宽度
|
|
|
+ type: 'dashed' // 刻度线的类型
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ legend: {
|
|
|
+ data: ['稼动率', '待机率', '报警率', '平均稼动率'],
|
|
|
+ textStyle: {
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 14
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ if (this.mode == 1) {
|
|
|
+ this.myChart.on('click', (params) => this.getOutputs(params));
|
|
|
+ if (this.option_1 && typeof option_1 === 'object') {
|
|
|
+ this.myChart.setOption(this.option_1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ this.myChart.on('click', (params) => this.getOutputs(params));
|
|
|
+ if (this.option_2 && typeof option_2 === 'object') {
|
|
|
+ this.myChart.setOption(this.option_2);
|
|
|
+ }
|
|
|
}
|
|
|
window.addEventListener('resize', this.myChart.resize);
|
|
|
},
|
|
|
getOutputs(params) {
|
|
|
if (params.componentType === 'series') {
|
|
|
- var oee = this.oees[params.dataIndex];
|
|
|
- this.outputInfo = oee.date + ' ' + oee.shift;
|
|
|
- this.outputs = [];
|
|
|
- this.outputs = oee.outPutPerHours;
|
|
|
- console.log(this.outputs);
|
|
|
+ var oee;
|
|
|
+ if (this.mode == 1) {
|
|
|
+ oee = this.oees_1[params.dataIndex];
|
|
|
+ this.outputInfo = oee.date + ' ' + oee.shift;
|
|
|
+ this.outputs = [];
|
|
|
+ this.outputs = oee.outPutPerHours;
|
|
|
+ var htmlstr = '<thead>< tr >'
|
|
|
+ + '<th style="width: 10%">时段</th>'
|
|
|
+ + '<th style="width: 10%">机种</th>'
|
|
|
+ + '<th style="width: 10%">运行时间</th>'
|
|
|
+ + '<th style="width: 10%">报警时间</th>'
|
|
|
+ + '<th style="width: 10%">待料时间</th>'
|
|
|
+ + '<th style="width: 10%">换料时间</th>'
|
|
|
+ + ' <th style = "width: 10%"> 产能</th> '
|
|
|
+ + '<th style="width: 10%">TT</th>'
|
|
|
+ + '<th style="width: 10%">报警次数</th>';
|
|
|
+ for (var item in this.outputs) {
|
|
|
+ htmlstr = htmlstr + '<tbody><tr>'
|
|
|
+ + '<td>' + this.outputs[item].period + '</td>'
|
|
|
+ + '<td>' + this.outputs[item].moduleType + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].autoRunTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].alarmTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].idleTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].loadMATTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + this.outputs[item].outPut + '</td>'
|
|
|
+ + '<td>' + this.outputs[item].tt + '</td>'
|
|
|
+ + '<td>' + this.outputs[item].alarmSum + '</td>'
|
|
|
+ + '</tr></tbody>';
|
|
|
+ }
|
|
|
+ $("#data").html(htmlstr);
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ var num = 0;
|
|
|
+ for (var item in this.oees_2) {
|
|
|
+ if (num == parseInt(params.componentIndex / 3)) {
|
|
|
+ oee = this.oees_2[item][params.dataIndex];
|
|
|
+ this.outputs = [];
|
|
|
+ this.outputs = oee.outPutPerHours;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ num++;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.outputInfo = oee.date;
|
|
|
+ var htmlstr = '<thead>< tr >'
|
|
|
+ + '<th style="width: 10%">时间</th>'
|
|
|
+ + '<th style="width: 10%">机种</th>'
|
|
|
+ + '<th style="width: 10%">运行时间</th>'
|
|
|
+ + '<th style="width: 10%">报警时间</th>'
|
|
|
+ + '<th style="width: 10%">待料时间</th>'
|
|
|
+ if ($("#selectMonth").val() == 1) {
|
|
|
+ for (var item in this.outputs) {
|
|
|
+ htmlstr = htmlstr + '<tbody><tr>'
|
|
|
+ + '<td>' + this.outputs[item].period + '</td>'
|
|
|
+ + '<td>' + this.outputs[item].moduleType + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].autoRunTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].alarmTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].idleTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '</tr></tbody>';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ for (var item in this.outputs) {
|
|
|
+ var datetime = moment(this.outputs[item].dataTime);
|
|
|
+ htmlstr = htmlstr + '<tbody><tr>'
|
|
|
+ + '<td>' + datetime.format('YYYY-MM-DD') + '</td>'
|
|
|
+ + '<td>' + this.outputs[item].moduleType + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].autoRunTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].alarmTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '<td>' + Math.round(this.outputs[item].idleTime / 60 * 10) / 10 + '</td>'
|
|
|
+ + '</tr></tbody>';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ $("#data").html(htmlstr);
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
getProductionLineMachineTree() {
|
|
|
+ let _this = this;
|
|
|
var setting = {
|
|
|
view: {
|
|
|
showIcon: false
|
|
|
+ },
|
|
|
+ callback: {
|
|
|
+ onClick: function (event, treeId, treeNode) {
|
|
|
+ if (treeNode.name == "Chamber汇总") {
|
|
|
+ $("#devicechoose").show();
|
|
|
+ $("#methodchoose").show();
|
|
|
+ _this.selected();
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ $("#devicechoose").hide();
|
|
|
+ $("#methodchoose").hide();
|
|
|
+ $(".date").datepicker("destroy");
|
|
|
+ $(".date").datepicker({
|
|
|
+ minViewMode: 'days',
|
|
|
+ format: 'yyyy-mm-dd',
|
|
|
+ language: 'zh-CN',
|
|
|
+ autoclose: true,
|
|
|
+ todayBtn: 'linked'
|
|
|
+ }).on('changeDate', function () {
|
|
|
+
|
|
|
+ }).on('keydown', function (e) {
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ var date1 = new Date(new Date().setDate(new Date().getDate() - 7));
|
|
|
+ var date2 = new Date(new Date().setDate(new Date().getDate() - 1));
|
|
|
+ //$("#date1").val(date1.getFullYear() + "-" + (date1.getMonth() + 1) + "-" + date1.getDate());
|
|
|
+ //$("#date2").val(date2.getFullYear() + "-" + (date2.getMonth() + 1) + "-" + date2.getDate());
|
|
|
+ var date1_1 = moment(date1);
|
|
|
+ var date2_1 = moment(date2);
|
|
|
+ $("#date1").val(date1_1.format('YYYY-MM-DD'));
|
|
|
+ $("#date2").val(date2_1.format('YYYY-MM-DD'));
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
};
|
|
|
+ ///下拉框
|
|
|
+ var setting1 = {
|
|
|
+ check: {
|
|
|
+ enable: true,
|
|
|
+ nocheckInherit: true,
|
|
|
+ chkboxType: { "Y": "ps", "N": "ps" }
|
|
|
+ },
|
|
|
+ callback: {
|
|
|
+ onCheck: function (event, treeId, treeNode) {
|
|
|
+ var checkedchamberlist = MutiSelectzTreeObj.getCheckedNodes();
|
|
|
+ _this.CheckedChamber = [];
|
|
|
+ $("#mutiSelect").val("");
|
|
|
+ var chambername = [];
|
|
|
+ for (x in checkedchamberlist) {
|
|
|
+ if (checkedchamberlist[x].name != "H5 Chamber") {
|
|
|
+ chambername.push(checkedchamberlist[x].name);
|
|
|
+ _this.CheckedChamber.push(checkedchamberlist[x]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ $("#mutiSelect").val(chambername.join(','));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
$.ajax({
|
|
|
url: '/ProductionLine/GetProductionLineMachineTree',
|
|
|
type: 'GET',
|
|
|
async: true,
|
|
|
success: function (zNodes) {
|
|
|
zTreeObj = $.fn.zTree.init($('#productionLineTree'), setting, zNodes);
|
|
|
+ for (var node in zNodes) {
|
|
|
+ if (node.name = "H5 Chamber") {
|
|
|
+ _this.ChamberList = [zNodes[node]];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ _this.ChamberList[0].children.splice(0, 1);
|
|
|
+ MutiSelectzTreeObj = $.fn.zTree.init($('#treeDemo'), setting1, _this.ChamberList);
|
|
|
+ MutiSelectzTreeObj.expandAll(true);
|
|
|
+
|
|
|
}
|
|
|
});
|
|
|
+
|
|
|
},
|
|
|
getOEES() {
|
|
|
+ if ($("#menuContent").css("display") == "block") {
|
|
|
+ $("#menuContent").css("display", "none");
|
|
|
+ }
|
|
|
+
|
|
|
+ let _this = this
|
|
|
var nodes = zTreeObj.getSelectedNodes()[0];
|
|
|
if (nodes == null) {
|
|
|
alert("请选择设备!");
|
|
|
return;
|
|
|
}
|
|
|
+ if (nodes.name == "Chamber汇总") {
|
|
|
+ this.mode = 2;
|
|
|
+ $("#devicechoose").show();
|
|
|
+ $("#methodchoose").show();
|
|
|
+ var idsStr = [];
|
|
|
+ for (var item in _this.CheckedChamber) {
|
|
|
+ idsStr.push(_this.CheckedChamber[item].id);
|
|
|
+ }
|
|
|
+ idsStr = idsStr.toString();
|
|
|
+ if (idsStr == null || idsStr == "") {
|
|
|
+ alert("请选择设备!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if ($("#selectMonth").val() == 1 && Math.floor(Math.abs(Date.parse($("#date2").val()) - Date.parse($("#date1").val())) / (1000 * 3600 * 24)) > 7) {
|
|
|
+ alert("按天统计时,不可超过7日!!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ $.ajax({
|
|
|
+ url: '/ReportForm/GetMachineStatisticV2',
|
|
|
+ type: 'POST',
|
|
|
+ async: true,
|
|
|
+ data: {
|
|
|
+ "id": idsStr.toString(),
|
|
|
+ "startTime": $("#date1").val(),
|
|
|
+ "endTime": $("#date2").val(),
|
|
|
+ "peroid": $("#selectMonth").val()
|
|
|
+ },
|
|
|
+ success: function (rev) {
|
|
|
+ if (rev.code === 0) {
|
|
|
+ _this.oees_2 = rev.data;
|
|
|
+ var xData = [];
|
|
|
+ _this.option_2.series = [];
|
|
|
+ var chambernum = 0;
|
|
|
+ var avgrunrate = [];
|
|
|
+ for (var i in rev.data) {
|
|
|
+ var chamber_name = "";
|
|
|
+ for (var j in _this.CheckedChamber) {
|
|
|
+ if (_this.CheckedChamber[j].id == i) {
|
|
|
+ chamber_name = _this.CheckedChamber[j].name;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ var seriestemp1 = {
|
|
|
+ type: 'value',
|
|
|
+ name: '稼动率',
|
|
|
+ data: [],
|
|
|
+ type: 'bar',
|
|
|
+ stack: chamber_name,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 12
|
|
|
+ }
|
|
|
+ }
|
|
|
+ var seriestemp2 = {
|
|
|
+ type: 'value',
|
|
|
+ name: '待机率',
|
|
|
+ data: [],
|
|
|
+ type: 'bar',
|
|
|
+ stack: chamber_name,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 12
|
|
|
+ },
|
|
|
+ };
|
|
|
+ var seriestemp3 =
|
|
|
+ {
|
|
|
+ type: 'value',
|
|
|
+ name: '报警率',
|
|
|
+ data: [],
|
|
|
+ type: 'bar',
|
|
|
+ stack: chamber_name,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 12
|
|
|
+ },
|
|
|
+ };
|
|
|
|
|
|
- let _this = this
|
|
|
+ for (var k in rev.data[i]) {
|
|
|
+ if (chambernum == 0) {
|
|
|
+ xData.push(rev.data[i][k].date);
|
|
|
+ avgrunrate.push(rev.data[i][k].runTimeRate);
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ avgrunrate[k] += rev.data[i][k].runTimeRate;
|
|
|
+ }
|
|
|
+ seriestemp1.data.push(rev.data[i][k].runTimeRate.toFixed(1));
|
|
|
+ seriestemp2.data.push(rev.data[i][k].idelTimeRate.toFixed(1));
|
|
|
+ seriestemp3.data.push(rev.data[i][k].downTimeRate.toFixed(1));
|
|
|
+ }
|
|
|
|
|
|
- $.ajax({
|
|
|
- url: '/ReportForm/GetMachineStatisticV1',
|
|
|
- type: 'POST',
|
|
|
- async: true,
|
|
|
- data: {
|
|
|
- "id": nodes.id,
|
|
|
- "startTime": $("#date1").val(),
|
|
|
- "endTime": $("#date2").val()
|
|
|
- },
|
|
|
- success: function (rev) {
|
|
|
- if (rev.code === 0) {
|
|
|
- _this.oees = rev.data;
|
|
|
-
|
|
|
- console.log(rev.data);
|
|
|
- var xData = [];
|
|
|
- var yDataProductA = [];
|
|
|
- var yDataProductB = [];
|
|
|
- var yDataProductC = [];
|
|
|
- var yDataProductD = [];
|
|
|
- var yDataProductE = [];
|
|
|
-
|
|
|
- for (var i = 0; i < rev.data.length; i++) {
|
|
|
- xData.push(rev.data[i].date + ' ' + rev.data[i].shift);
|
|
|
- yDataProductA.push(rev.data[i].outputs);
|
|
|
- yDataProductB.push(rev.data[i].runTimeRate);
|
|
|
- yDataProductC.push(rev.data[i].idelTimeRate);
|
|
|
- yDataProductD.push(rev.data[i].downTimeRate);
|
|
|
- yDataProductE.push(rev.data[i].loadMATTimeRate);
|
|
|
+ _this.option_2.series.push(seriestemp1);
|
|
|
+ _this.option_2.series.push(seriestemp2);
|
|
|
+ _this.option_2.series.push(seriestemp3);
|
|
|
+
|
|
|
+ chambernum++;
|
|
|
+ }
|
|
|
+ for (var item in avgrunrate) {
|
|
|
+ avgrunrate[item] = (avgrunrate[item] / chambernum).toFixed(1);
|
|
|
+ }
|
|
|
+ _this.option_2.series.push({
|
|
|
+ type: 'value',
|
|
|
+ name: '平均稼动率',
|
|
|
+ data: avgrunrate,
|
|
|
+ type: 'line',
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'white',
|
|
|
+ fontSize: 12
|
|
|
+ }
|
|
|
+ })
|
|
|
+ _this.option_2.xAxis.data = xData;
|
|
|
+ _this.myChart.clear();
|
|
|
+ _this.myChart.setOption(_this.option_2, true);//true重绘
|
|
|
+
|
|
|
+ } else {
|
|
|
+ alert(rev.message);
|
|
|
}
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ this.mode = 1;
|
|
|
+ $("#devicechoose").hide();
|
|
|
+ $("#methodchoose").hide();
|
|
|
+ $.ajax({
|
|
|
+ url: '/ReportForm/GetMachineStatisticV1',
|
|
|
+ type: 'POST',
|
|
|
+ async: true,
|
|
|
+ data: {
|
|
|
+ "id": nodes.id,
|
|
|
+ "startTime": $("#date1").val(),
|
|
|
+ "endTime": $("#date2").val()
|
|
|
+ },
|
|
|
+ success: function (rev) {
|
|
|
+ if (rev.code === 0) {
|
|
|
+ _this.oees_1 = rev.data;
|
|
|
+ var xData = [];
|
|
|
+ var yDataProductA = [];
|
|
|
+ var yDataProductB = [];
|
|
|
+ var yDataProductC = [];
|
|
|
+ var yDataProductD = [];
|
|
|
+ var yDataProductE = [];
|
|
|
|
|
|
- _this.option.xAxis.data = xData;
|
|
|
- _this.option.series[0].data = yDataProductB;
|
|
|
- _this.option.series[1].data = yDataProductC;
|
|
|
- _this.option.series[2].data = yDataProductD;
|
|
|
- _this.option.series[3].data = yDataProductE;
|
|
|
- _this.option.series[4].data = yDataProductA;
|
|
|
- _this.myChart.setOption(_this.option);
|
|
|
- } else {
|
|
|
- alert(rev.message);
|
|
|
+ for (var i = 0; i < rev.data.length; i++) {
|
|
|
+ xData.push(rev.data[i].date + ' ' + rev.data[i].shift);
|
|
|
+ yDataProductA.push(rev.data[i].outputs);
|
|
|
+ yDataProductB.push(rev.data[i].runTimeRate);
|
|
|
+ yDataProductC.push(rev.data[i].idelTimeRate);
|
|
|
+ yDataProductD.push(rev.data[i].downTimeRate);
|
|
|
+ yDataProductE.push(rev.data[i].loadMATTimeRate);
|
|
|
+ }
|
|
|
+
|
|
|
+ _this.option_1.xAxis.data = xData;
|
|
|
+ _this.option_1.series[0].data = yDataProductB;
|
|
|
+ _this.option_1.series[1].data = yDataProductC;
|
|
|
+ _this.option_1.series[2].data = yDataProductD;
|
|
|
+ _this.option_1.series[3].data = yDataProductE;
|
|
|
+ _this.option_1.series[4].data = yDataProductA;
|
|
|
+
|
|
|
+
|
|
|
+ _this.myChart.clear();
|
|
|
+ _this.myChart.setOption(_this.option_1, true);//true重绘
|
|
|
+ } else {
|
|
|
+ alert(rev.message);
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- });
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
exportExcelTemplate() {
|
|
|
var sheetName = 'sheet1';
|
|
@@ -291,7 +691,7 @@
|
|
|
|
|
|
var sheet = {};
|
|
|
|
|
|
- sheet['!ref'] = 'A1:' + 'K' + (this.oees.length + 1);
|
|
|
+ sheet['!ref'] = 'A1:' + 'K' + (this.oees_1.length + 1);
|
|
|
sheet['!cols'] = [
|
|
|
{ wch: 10 },
|
|
|
{ wch: 12 },
|
|
@@ -318,7 +718,7 @@
|
|
|
sheet['J1'] = { t: "s", v: "报警率(%)" };
|
|
|
sheet['K1'] = { t: "s", v: "换料率(%)" };
|
|
|
|
|
|
- this.oees.forEach(function (row, i) {
|
|
|
+ this.oees_1.forEach(function (row, i) {
|
|
|
sheet[String.fromCharCode(65) + (i + 2)] = { v: row.date };
|
|
|
sheet[String.fromCharCode(66) + (i + 2)] = { v: row.shift };
|
|
|
sheet[String.fromCharCode(67) + (i + 2)] = { v: row.outputs };
|
|
@@ -367,6 +767,70 @@
|
|
|
event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
|
|
|
}
|
|
|
aLink.dispatchEvent(event);
|
|
|
+ },
|
|
|
+ showMenu() {
|
|
|
+ if ($("#menuContent").css("display") == "block") {
|
|
|
+ $("#menuContent").css("display", "none");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ $("#menuContent").css("display", "block");
|
|
|
+ $("#menuContent").css("left", $('#mutiSelect').offset().left - $('#form1').offset().left + "px");
|
|
|
+ $("#menuContent").css("top", $('#devicechoose').height() + "px");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selected() {
|
|
|
+ var v = $("#selectMonth").val();
|
|
|
+ if (v == 1 || v == 2 || v == "") {
|
|
|
+ $(".date").datepicker("destroy");
|
|
|
+ $(".date").datepicker({
|
|
|
+ minViewMode: 'days',
|
|
|
+ format: 'yyyy-mm-dd',
|
|
|
+ language: 'zh-CN',
|
|
|
+ autoclose: true,
|
|
|
+ todayBtn: 'linked'
|
|
|
+ }).on('changeDate', function () {
|
|
|
+
|
|
|
+ }).on('keydown', function (e) {
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ var date1 = new Date(new Date().setDate(new Date().getDate() - 7));
|
|
|
+ var date2 = new Date(new Date().setDate(new Date().getDate() - 1));
|
|
|
+ var date1_1 = moment(date1);
|
|
|
+ var date2_1 = moment(date2);
|
|
|
+ //$("#date1").val(date1.getFullYear() + "-" + (date1.getMonth() + 1) + "-" + date1.getDate());
|
|
|
+ //$("#date2").val(date2.getFullYear() + "-" + (date2.getMonth() + 1) + "-" + date2.getDate());
|
|
|
+ $("#date1").val(date1_1.format('YYYY-MM-DD'));
|
|
|
+ $("#date2").val(date2_1.format('YYYY-MM-DD'));
|
|
|
+ console.log(date1_1.format('YYYY-MM'));
|
|
|
+ console.log(date2_1.format('YYYY-MM'));
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ $(".date").datepicker("destroy");
|
|
|
+ $(".date").datepicker({
|
|
|
+ minViewMode: 'months',
|
|
|
+ format: 'yyyy-mm',
|
|
|
+ language: 'zh-CN',
|
|
|
+ autoclose: true,
|
|
|
+ todayBtn: 'linked'
|
|
|
+ }).on('changeDate', function () {
|
|
|
+
|
|
|
+ }).on('keydown', function (e) {
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ var date1 = new Date(new Date().setDate(new Date().getDate() - 7));
|
|
|
+ var date2 = new Date(new Date().setDate(new Date().getDate() - 1));
|
|
|
+ //$("#date1").val(date1.getFullYear() + "-" + (date1.getMonth() + 1));
|
|
|
+ //$("#date2").val(date2.getFullYear() + "-" + (date2.getMonth() + 1));
|
|
|
+ var date1_1 = moment(date1);
|
|
|
+ var date2_1 = moment(date2);
|
|
|
+ //$("#date1").val(date1.getFullYear() + "-" + (date1.getMonth() + 1) + "-" + date1.getDate());
|
|
|
+ //$("#date2").val(date2.getFullYear() + "-" + (date2.getMonth() + 1) + "-" + date2.getDate());
|
|
|
+ $("#date1").val(date1_1.format('YYYY-MM'));
|
|
|
+ $("#date2").val(date2_1.format('YYYY-MM'));
|
|
|
+ console.log(date1_1.format('YYYY-MM'));
|
|
|
+ console.log(date2_1.format('YYYY-MM'));
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
filters: {
|