You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
407 lines
16 KiB
407 lines
16 KiB
$(document).ready(function () {
|
|
Daterangeini();
|
|
//QueryddlStatus();
|
|
//1.初始化Table
|
|
$('#wodaterange').tooltip();
|
|
|
|
})
|
|
|
|
/*显示daterangepicker*/
|
|
function Daterangeini() {
|
|
$('#rangetime').val(moment().subtract('hours', 0).format('YYYY-MM-DD') + ' 07:20:00' + ' - ' + moment().format('YYYY-MM-DD') + ' 19:20:00');
|
|
$('#rangetime').daterangepicker(
|
|
{
|
|
//autoUpdateInput: false,
|
|
timePicker: true,
|
|
timePicker24Hour: true,
|
|
"opens": "center",
|
|
'locale': {
|
|
"format": 'YYYY-MM-DD HH:mm:ss',
|
|
"separator": " - ",
|
|
"applyLabel": "确定",
|
|
"cancelLabel": "取消",
|
|
"fromLabel": "起始时间",
|
|
"toLabel": "结束时间'",
|
|
"customRangeLabel": "自定义",
|
|
"weekLabel": "W",
|
|
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
|
|
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
|
|
"firstDay": 1,
|
|
//"cancelLabel": '清除'
|
|
}
|
|
});
|
|
//$('#rangetime').val('');
|
|
$('#rangetime').on('cancel.daterangepicker', function (ev, picker) {
|
|
$(this).val('');
|
|
});
|
|
}
|
|
|
|
|
|
let productsinfo = new Vue({
|
|
el: '#FragmentationRate',
|
|
components: {
|
|
'BootstrapTable': BootstrapTable },
|
|
data:{
|
|
columns:[],
|
|
data:[],
|
|
options:{
|
|
pagination: true, //是否显示分页(*)
|
|
pageSize: 12, //每页的记录行数(*)
|
|
search: true, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,
|
|
strictSearch: true,
|
|
showColumns: true, //是否显示所有的列
|
|
showRefresh: true,
|
|
}
|
|
},
|
|
methods: {
|
|
//查询表格数据
|
|
inquireinfo: function () {
|
|
var self = this;
|
|
var categories = [];
|
|
var series = [];
|
|
var color1 = ['#073179', '#073179', '#f17747', '#f17747', '#00a8f3', '#00a8f3',
|
|
'#7e78ed', '#7e78ed', '#e2db4f', '#e2db4f', '#78ed97', '#78ed97', '#ed789f',
|
|
'#ed789f', '#522954', '#522954', '#298749', '#298749', '#c198b6', '#c198b6',
|
|
'#c1aa98', '#c1aa98', '#947171', '#947171', '#f8c2c2', '#f8c2c2', '#b6b5ba',
|
|
'#b6b5ba', '#575454', '#575454', '#550404', '#550404'];
|
|
var color2 = ['#00a8f3','#cc5e3f'];
|
|
var obj={
|
|
text: ''
|
|
}
|
|
self.columns = [];
|
|
//console.log($('#ddlWorkshop').val());
|
|
if ($('#ddlMachine').val() == null && $('#ddlWorkshop').val() == null && $('#rangetime').val() =='') {
|
|
categories = [];
|
|
series = [];
|
|
color1 = [];
|
|
self.charts(categories, series, color1);
|
|
toastr.warning('请输入查询参数', '', { progressBar: true });
|
|
return;
|
|
} else {
|
|
self.requestApi({
|
|
modulename: "FragmentationRate",
|
|
funname: "FragmentationRate", //BatchRate
|
|
para: { machine: $('#ddlMachine').val(), workshop: $('#ddlWorkshop').val(), bt:($('#rangetime').val().substr(0, 19)), et:($('#rangetime').val().split(' - ')[1])},
|
|
success: (res) => {
|
|
console.log(res);
|
|
self.data = res;
|
|
var kis = [];
|
|
if (self.data.length == 0){//判断是否可以查到数据
|
|
categories = [];
|
|
series = [];
|
|
color1 = [];
|
|
self.charts(categories, series, color1);
|
|
} else {
|
|
for (let key in self.data[0]) {//动态获取表头
|
|
self.columns.push(
|
|
{
|
|
field: key,
|
|
title: key,
|
|
valign: "middle",
|
|
align: "center",
|
|
}
|
|
);
|
|
//将表中数据放到一个数组中
|
|
for (var k = 0; k < self.data.length; k++) {
|
|
var dat = self.percentage(self.data[k][key])
|
|
kis.push(dat)
|
|
}
|
|
}
|
|
console.log(kis)
|
|
//视图数据处理
|
|
if (self.data.length > 1) {
|
|
for (var i = 0; i < self.data.length; i++) {
|
|
categories.push(
|
|
self.data[i]["机台号"]
|
|
)
|
|
};
|
|
obj.text = $('#ddlWorkshop').find("option:selected").text() + "一次碎片率视图"//获取车间名称
|
|
var x1 = Object.keys(self.data[0]);
|
|
console.log(x1)
|
|
var m = 3 * self.data.length;
|
|
for (var j = 3; j < Object.keys(self.data[0]).length - 1; j += 2) {
|
|
series.push(
|
|
{
|
|
type: 'column',
|
|
yAxis: 1,
|
|
name: x1[j],
|
|
data: kis.slice(m, m + self.data.length)
|
|
},
|
|
{
|
|
type: 'spline',
|
|
name: x1[j + 1],
|
|
data: kis.slice(m + self.data.length, m + 2 * self.data.length),
|
|
|
|
}
|
|
)
|
|
m = m + 2 * self.data.length;
|
|
};
|
|
self.charts(obj, categories, series, color1);
|
|
}
|
|
else if (self.data.length == 1) {
|
|
var x2 = Object.keys(self.data[0]);
|
|
var dt1 = [];
|
|
var dt2 = [];
|
|
obj.text = self.data[0]["机台号"] + "碎片率视图"
|
|
for (var j = 3; j < Object.keys(self.data[0]).length - 1; j += 2) {//动态获取横坐标
|
|
categories.push(
|
|
x2[j]
|
|
)
|
|
}
|
|
|
|
for (var s1 = 3; s1 < kis.length - 1; s1 += 2) {
|
|
dt1.push(
|
|
kis[s1]
|
|
)
|
|
}
|
|
for (var s2 = 4; s2 < kis.length - 1; s2 += 2) {
|
|
dt2.push(
|
|
kis[s2]
|
|
)
|
|
}
|
|
series.push(
|
|
{
|
|
type: 'column',
|
|
yAxis: 1,
|
|
name: '数量',
|
|
data: dt1,
|
|
},
|
|
{
|
|
type: 'spline',
|
|
name: '比率',
|
|
data: dt2,
|
|
dashStyle: 'DashDot',
|
|
marker: {
|
|
symbol: 'cross',
|
|
lineColor: null,
|
|
lineWidth: 6
|
|
}
|
|
|
|
}
|
|
)
|
|
|
|
self.charts(obj, categories, series, color2);
|
|
}
|
|
}
|
|
// console.log(dt2)
|
|
//console.log(categories)
|
|
// console.log(series)
|
|
|
|
},
|
|
fail: (ex) => {
|
|
console.log(ex);
|
|
}
|
|
})
|
|
}
|
|
},
|
|
//去除百分号
|
|
percentage: function (date) {
|
|
var f;
|
|
if (date.toString().indexOf("%") != -1) {
|
|
f = Number(date.toString().slice(0, date.toString().length - 1))
|
|
|
|
} else {
|
|
f = Number(date);
|
|
}
|
|
return f;
|
|
},
|
|
requestApi: function (config) {//modulename, funname, para, success, fail) {
|
|
fetch("/api/" + config.modulename + "/" + config.funname + "", {
|
|
method: "post",
|
|
headers: {
|
|
"Accept": "application/json, text/plain, */*",
|
|
"Content-Type": "application/json"
|
|
},
|
|
body: JSON.stringify(config.para)
|
|
}).then(
|
|
(res) => { return res.json() }
|
|
).then(
|
|
(res) => { config.success(res) }
|
|
).catch(
|
|
(ex) => { config.fail(ex) }
|
|
)
|
|
},
|
|
form: function (config) {
|
|
fetch("/" + config.modulename + "/" + config.funname + "", {
|
|
method: "post",
|
|
headers: {
|
|
"Accept": "application/json, text/plain, */*",
|
|
"Content-Type": "application/json"
|
|
},
|
|
body: JSON.stringify(config.para)
|
|
}).then(
|
|
(res) => { return res.json() }
|
|
).then(
|
|
(res) => { config.success(res) }
|
|
).catch(
|
|
(ex) => { config.fail(ex) }
|
|
)
|
|
},
|
|
charts: function (d,a,b,c){
|
|
$('#container').highcharts({
|
|
chart: {
|
|
zoomType: 'xy'
|
|
},
|
|
title:d,
|
|
colors: c,
|
|
xAxis: {
|
|
categories: a,
|
|
crosshair: true
|
|
},
|
|
yAxis: [
|
|
{
|
|
min: 0,
|
|
//tickInterval: 5,
|
|
title: {
|
|
text: '破片率'
|
|
},
|
|
labels: {
|
|
formatter: function () {
|
|
return this.value + '%';
|
|
}
|
|
},
|
|
opposite: true
|
|
},
|
|
{
|
|
min: 0,
|
|
// tickInterval: 100,
|
|
title: {
|
|
text: '破片数'
|
|
}
|
|
}
|
|
],
|
|
//tooltip: {
|
|
// shared: true
|
|
//},
|
|
tooltip: {
|
|
// head + 每个 point + footer 拼接成完整的 table
|
|
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
|
|
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
|
|
'<td style="padding:0"><b>{point.y:.2f}</b></td></tr>',
|
|
footerFormat: '</table>',
|
|
shared: true,
|
|
useHTML: true
|
|
},
|
|
plotOptions: {
|
|
column: {
|
|
// borderWidth: 0,
|
|
// pointWidth:15,
|
|
//groupPadding:0.8,
|
|
|
|
}
|
|
},
|
|
series: b
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
});
|
|
|
|
function QueryStorageMachineByWorkshop(areacode) {
|
|
var promise = $.ajax({
|
|
url: '/api/Orders/QueryMachine',
|
|
type: 'post',
|
|
cache: true,
|
|
async: true,
|
|
contentType: "application/json",
|
|
data: JSON.stringify({
|
|
areacode: areacode
|
|
})
|
|
});
|
|
promise.done(function (r) {
|
|
console.log(r)
|
|
var options = '';
|
|
$.each(r.info, function (index, v) {
|
|
options += "<option value='" + v.wks_id + "'>" + v.wks_desc + "</option>";
|
|
});
|
|
$('#ddlMachine').html(options);
|
|
$('#ddlMachine').val('');
|
|
$('#ddlMachine').select2({
|
|
placeholder: "选择机台号",
|
|
allowClear: true
|
|
});
|
|
|
|
});
|
|
promise.fail(function (error) {
|
|
console.log(error)
|
|
alert(error);
|
|
});
|
|
}
|
|
|
|
//查询车间
|
|
function QueryddlWorkshop(){
|
|
var promiseweld = $.ajax({
|
|
url: '/api/Orders/QueryWorkshop', //'/api/QC/QueryStatus'
|
|
type: 'post',
|
|
cache: true,
|
|
async: true,
|
|
});
|
|
promiseweld.done(function (r) {
|
|
console.log(r);
|
|
$.each(r.info, function (index, value) {
|
|
console.log(index);
|
|
$("#ddlWorkshop").append("<option value='" + value.area_code + "'>" + value.descriptions + "</option>");
|
|
})
|
|
$('#ddlWorkshop').val('');
|
|
$('#ddlWorkshop').select2({
|
|
placeholder: "车间",
|
|
allowClear: true
|
|
});
|
|
$('#ddlWorkshop').on('select2:select', function (e) {
|
|
console.log($(this).val());
|
|
var selectvalue = $(this).val();
|
|
QueryStorageMachineByWorkshop(selectvalue);
|
|
});
|
|
});
|
|
promiseweld.fail(function (error) {
|
|
console.log(error)
|
|
alert(error);
|
|
});
|
|
}
|
|
QueryddlWorkshop();
|
|
|
|
|
|
//导出EXCEl
|
|
$('#btnExportExcel').click(function () {
|
|
if ($('#ddlMachine').val() == null && $('#ddlWorkshop').val() == null && $('#rangetime').val() == '') {
|
|
toastr.warning('请输入查询参数', '', { progressBar: true });
|
|
return;
|
|
}
|
|
doPost('/Report/FragmentationExcel', [
|
|
workshop = $('#ddlWorkshop').val(),
|
|
machine = $('#ddlMachine').val(),
|
|
bt=($('#rangetime').val().substr(0, 19)),
|
|
et=($('#rangetime').val().split(' - ')[1]),
|
|
])
|
|
})
|
|
function doPost(to, p) { // to:提交动作(action),p:参数
|
|
var myForm = document.createElement("form");
|
|
myForm.method = "post";
|
|
myForm.action = to;
|
|
for (var i in p) {
|
|
var myInput = document.createElement("input");
|
|
myInput.setAttribute("name", "para"); // 为input对象设置name
|
|
myInput.setAttribute("value", p[i]); // 为input对象设置value
|
|
myForm.appendChild(myInput);
|
|
}
|
|
document.body.appendChild(myForm);
|
|
myForm.submit();
|
|
document.body.removeChild(myForm); // 提交后移除创建的form
|
|
}
|
|
|
|
|
|
//var columns = [];
|
|
//for (var i = 0; i < self.data.length; i++) {
|
|
// for(let key in self.data[i]){
|
|
// columns.push(
|
|
// {
|
|
// field: key,
|
|
// title:key,
|
|
// valign: "middle",
|
|
// align: "center",
|
|
// }
|
|
// );
|
|
// }
|
|
|
|
//}
|