4 changed files with 257 additions and 234 deletions
-
6src/views/orderBoard.vue
-
473src/views/productOutBoard.vue
-
7src/views/reportAbnormal.vue
-
5src/views/scheduledBoard.vue
@ -1,268 +1,277 @@ |
|||||
<template> |
<template> |
||||
<div class="container"> |
|
||||
<div style="width:100%;height: 25%;text-align:center;"> |
|
||||
<TimeC></TimeC> |
|
||||
<div style="float: left;width: 50%;height: 100%;text-align:center;margin-left: 26% "> |
|
||||
<div style="height: 40%;width: 100%;text-align: center;margin-top: 3%;"> |
|
||||
<label style="font-size: 30px;color: #ffffff"> 成品当日实时产出情况</label> |
|
||||
|
<div class="container"> |
||||
|
<div style="width:100%;height: 25%;text-align:center;"> |
||||
|
<TimeC></TimeC> |
||||
|
<div style="float: left;width: 50%;height: 100%;text-align:center;margin-left: 26% "> |
||||
|
<div style="height: 40%;width: 100%;text-align: center;margin-top: 3%;"> |
||||
|
<label style="font-size: 30px;color: #ffffff"> 成品当日实时产出情况</label> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row top-buffer" style="width:100%;height: 60%;text-align: center"> |
||||
|
<div style="float:left;margin-top: 0px; width: 40%; height:100%;margin-left: 7%;"> |
||||
|
<table class="table table-bordered" style="width:100%;font-size:22px;color: #ffffff" id="table1"> |
||||
|
</table> |
||||
|
</div> |
||||
|
<div class="row top-buffer" style="float:left; margin-top: 0px; width: 40%; height:100%;margin-left: 6%;"> |
||||
|
<table class="table table-bordered" style="width:100%;font-size:22px;color: #ffffff" id="table2"> |
||||
|
</table> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
</div> |
|
||||
<div class="row top-buffer" style="width:100%;height: 60%;text-align: center"> |
|
||||
<div style="float:left;margin-top: 0px; width: 40%; height:100%;margin-left: 7%;"> |
|
||||
<table class="table table-bordered" style="width:100%;font-size:22px;color: #ffffff" id="table1"> |
|
||||
</table> |
|
||||
</div> |
|
||||
<div class="row top-buffer" style="float:left; margin-top: 0px; width: 40%; height:100%;margin-left: 6%;"> |
|
||||
<table class="table table-bordered" style="width:100%;font-size:22px;color: #ffffff" id="table2"> |
|
||||
</table> |
|
||||
</div> |
|
||||
</div> |
</div> |
||||
</div> |
|
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import TimeC from "./time" |
|
||||
export default { |
|
||||
name: "productOutBoard", |
|
||||
data() { |
|
||||
return { |
|
||||
currentDate: null, |
|
||||
stringdate: null, |
|
||||
countTimer: null, |
|
||||
loader: null, |
|
||||
timer: null, |
|
||||
handler: null, |
|
||||
nextPage: null, |
|
||||
} |
|
||||
}, |
|
||||
components: { |
|
||||
TimeC |
|
||||
}, |
|
||||
methods: { |
|
||||
loadTime() { |
|
||||
let that = this; |
|
||||
$.ajax({ |
|
||||
url: "/board/getJumpConfig", |
|
||||
type: "post", |
|
||||
data: {"boardName": 'productOutBoard'}, |
|
||||
dataType: "json", |
|
||||
success: (data) => { |
|
||||
if (data.rows2 != "" && data.rows2 != null) { |
|
||||
that.nextPage = data.rows2; |
|
||||
if (data.rows != "" && data.rows != null) { |
|
||||
let jumpTime = Number(data.rows); |
|
||||
if (jumpTime > 0) { |
|
||||
that.countTimer = window.setTimeout(() => { |
|
||||
that.jump() |
|
||||
}, 1000 * jumpTime); |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
}).fail(() => { |
|
||||
this.$router.push("/") |
|
||||
}) |
|
||||
}, |
|
||||
jump() { |
|
||||
let that = this; |
|
||||
clearTimeout(that.countTimer); |
|
||||
clearInterval(that.loader); |
|
||||
clearInterval(that.timer); |
|
||||
$.ajax({ |
|
||||
url: "/board/kanKanYouMeiYouDiaoXian", |
|
||||
type: "post", |
|
||||
data: {}, |
|
||||
dataType: "json", |
|
||||
success: (data) => { |
|
||||
this.$router.push(this.nextPage); |
|
||||
} |
|
||||
}).fail(() => { |
|
||||
this.$router.push("/") |
|
||||
}) |
|
||||
|
import TimeC from "./time" |
||||
|
|
||||
}, |
|
||||
load2() { |
|
||||
this.refresh(); |
|
||||
let that = this; |
|
||||
$.ajax({ |
|
||||
url: "/board/getRefreshTime", |
|
||||
type: "post", |
|
||||
data: {"boardName": 'productOutBoard'}, |
|
||||
dataType: "json", |
|
||||
success: function (data) { |
|
||||
if (data.rows != "" && data.rows != null) { |
|
||||
let refreshTime = Number(data.rows); |
|
||||
if (refreshTime > 0) { |
|
||||
that.loader = window.setInterval(() => { |
|
||||
that.refresh() |
|
||||
}, 1000 * refreshTime); |
|
||||
|
export default { |
||||
|
name: "productOutBoard", |
||||
|
data() { |
||||
|
return { |
||||
|
currentDate: null, |
||||
|
stringdate: null, |
||||
|
countTimer: null, |
||||
|
loader: null, |
||||
|
timer: null, |
||||
|
handler: null, |
||||
|
nextPage: null, |
||||
} |
} |
||||
} else { |
|
||||
that.loader = window.setInterval(() => { |
|
||||
that.refresh() |
|
||||
}, 10000); |
|
||||
} |
|
||||
}, |
}, |
||||
}) |
|
||||
|
|
||||
}, |
|
||||
refresh() { |
|
||||
let that = this; |
|
||||
$.ajax({ |
|
||||
url: "/board/getProductOutData", |
|
||||
type: "post", |
|
||||
data: {}, |
|
||||
dataType: "json", |
|
||||
success: function (data) { |
|
||||
that.data1 = {"total": data.rows1.length, "rows": data.rows1}; |
|
||||
that.data2 = {"total": data.rows2.length, "rows": data.rows2}; |
|
||||
$('#table1').bootstrapTable('load', that.data1); |
|
||||
$('#table2').bootstrapTable('load', that.data2); |
|
||||
|
components: { |
||||
|
TimeC |
||||
}, |
}, |
||||
|
methods: { |
||||
|
loadTime() { |
||||
|
let that = this; |
||||
|
$.ajax({ |
||||
|
url: "/board/getJumpConfig", |
||||
|
type: "post", |
||||
|
data: {"boardName": 'productOutBoard'}, |
||||
|
dataType: "json", |
||||
|
success: (data) => { |
||||
|
if (data.rows2 != "" && data.rows2 != null) { |
||||
|
that.nextPage = data.rows2; |
||||
|
if (data.rows != "" && data.rows != null) { |
||||
|
let jumpTime = Number(data.rows); |
||||
|
if (jumpTime > 0) { |
||||
|
that.countTimer = window.setTimeout(() => { |
||||
|
that.jump(); |
||||
|
}, 1000 * jumpTime); |
||||
|
|
||||
}) |
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}).fail(() => { |
||||
|
this.$router.push("/") |
||||
|
}) |
||||
|
}, |
||||
|
jump() { |
||||
|
let that = this; |
||||
|
clearTimeout(that.countTimer); |
||||
|
clearInterval(that.loader); |
||||
|
clearInterval(that.timer); |
||||
|
$.ajax({ |
||||
|
url: "/board/kanKanYouMeiYouDiaoXian", |
||||
|
type: "post", |
||||
|
data: {}, |
||||
|
dataType: "json", |
||||
|
success: (data) => { |
||||
|
this.$router.push(this.nextPage); |
||||
|
} |
||||
|
}).fail(() => { |
||||
|
this.$router.push("/") |
||||
|
}) |
||||
|
|
||||
}, |
|
||||
|
}, |
||||
|
load2() { |
||||
|
this.refresh(); |
||||
|
let that = this; |
||||
|
$.ajax({ |
||||
|
url: "/board/getRefreshTime", |
||||
|
type: "post", |
||||
|
data: {"boardName": 'productOutBoard'}, |
||||
|
dataType: "json", |
||||
|
success: function (data) { |
||||
|
if (data.rows != "" && data.rows != null) { |
||||
|
let refreshTime = Number(data.rows); |
||||
|
if (refreshTime > 0) { |
||||
|
that.loader = window.setInterval(() => { |
||||
|
that.refresh(); |
||||
|
}, 1000 * refreshTime); |
||||
|
} |
||||
|
} else { |
||||
|
that.loader = window.setInterval(() => { |
||||
|
that.refresh(); |
||||
|
}, 10000); |
||||
|
} |
||||
|
}, |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
refresh() { |
||||
|
let that = this; |
||||
|
$.ajax({ |
||||
|
url: "/board/getProductOutData", |
||||
|
type: "post", |
||||
|
data: {}, |
||||
|
dataType: "json", |
||||
|
success: function (data) { |
||||
|
if (data.success) { |
||||
|
that.data1 = {"total": data.rows1.length, "rows": data.rows1}; |
||||
|
that.data2 = {"total": data.rows2.length, "rows": data.rows2}; |
||||
|
$('#table1').bootstrapTable('load', that.data1); |
||||
|
$('#table2').bootstrapTable('load', that.data2); |
||||
|
} else { |
||||
|
this.jump(); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
tableInit2() { |
|
||||
$('#table2').bootstrapTable('destroy').bootstrapTable({ |
|
||||
striped: true, //是否显示行间隔色 |
|
||||
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*) |
|
||||
pagination: false, //是否显示分页(*) |
|
||||
sortable: false, //是否启用排序 |
|
||||
sortOrder: "asc", //排序方式 |
|
||||
queryParamsType: "undefined", //排序方式 |
|
||||
queryParams: function queryParams(params) { //设置查询参数 |
|
||||
|
error: () => { |
||||
|
this.jump(); |
||||
|
} |
||||
|
|
||||
}, |
|
||||
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*) |
|
||||
pageNumber: 1, //初始化加载第一页,默认第一页 |
|
||||
pageSize: 10, //每页的记录行数(*) |
|
||||
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*) |
|
||||
search: false, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大 |
|
||||
searchTimeOut: 1000, |
|
||||
// : true, |
|
||||
showColumns: false, //是否显示所有的列 |
|
||||
showRefresh: false, //是否显示刷新按钮 |
|
||||
minimumCountColumns: 2, //最少允许的列数 |
|
||||
clickToSelect: true, //是否启用点击选中行 |
|
||||
singleSelect: true, |
|
||||
// height: height_param*0.6 , //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度 |
|
||||
uniqueId: "id", //每一行的唯一标识,一般为主键列 |
|
||||
// showToggle: true, //是否显示详细视图和列表视图的切换按钮 |
|
||||
cardView: false, //是否显示详细视图 |
|
||||
detailView: false, //是否显示父子表 |
|
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
|
||||
columns: [{ |
|
||||
field: 'cinvcname', |
|
||||
title: '存货大类', |
|
||||
width: 100, |
|
||||
valign: 'middle', |
|
||||
cellStyle: function () { |
|
||||
return {css: {"height": "50px", "color": "yellow"}} |
|
||||
} |
|
||||
|
|
||||
}, { |
|
||||
field: 'transQty', |
|
||||
title: '入库数量', |
|
||||
width: 100, |
|
||||
valign: 'middle', |
|
||||
cellStyle: function () { |
|
||||
return {css: {"height": "50px", "color": "yellow"}} |
|
||||
} |
|
||||
|
tableInit2() { |
||||
|
$('#table2').bootstrapTable('destroy').bootstrapTable({ |
||||
|
striped: true, //是否显示行间隔色 |
||||
|
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*) |
||||
|
pagination: false, //是否显示分页(*) |
||||
|
sortable: false, //是否启用排序 |
||||
|
sortOrder: "asc", //排序方式 |
||||
|
queryParamsType: "undefined", //排序方式 |
||||
|
queryParams: function queryParams(params) { //设置查询参数 |
||||
|
|
||||
} |
|
||||
], |
|
||||
onLoadSuccess: function (data) { |
|
||||
|
}, |
||||
|
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*) |
||||
|
pageNumber: 1, //初始化加载第一页,默认第一页 |
||||
|
pageSize: 10, //每页的记录行数(*) |
||||
|
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*) |
||||
|
search: false, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大 |
||||
|
searchTimeOut: 1000, |
||||
|
// : true, |
||||
|
showColumns: false, //是否显示所有的列 |
||||
|
showRefresh: false, //是否显示刷新按钮 |
||||
|
minimumCountColumns: 2, //最少允许的列数 |
||||
|
clickToSelect: true, //是否启用点击选中行 |
||||
|
singleSelect: true, |
||||
|
// height: height_param*0.6 , //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度 |
||||
|
uniqueId: "id", //每一行的唯一标识,一般为主键列 |
||||
|
// showToggle: true, //是否显示详细视图和列表视图的切换按钮 |
||||
|
cardView: false, //是否显示详细视图 |
||||
|
detailView: false, //是否显示父子表 |
||||
|
|
||||
|
|
||||
} |
|
||||
}); |
|
||||
}, |
|
||||
tableInit3() { |
|
||||
$('#table1').bootstrapTable('destroy').bootstrapTable({ |
|
||||
striped: true, //是否显示行间隔色 |
|
||||
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*) |
|
||||
pagination: false, //是否显示分页(*) |
|
||||
sortable: false, //是否启用排序 |
|
||||
sortOrder: "asc", //排序方式 |
|
||||
queryParamsType: "undefined", //排序方式 |
|
||||
queryParams: function queryParams(params) { //设置查询参数 |
|
||||
|
columns: [{ |
||||
|
field: 'cinvcname', |
||||
|
title: '存货大类', |
||||
|
width: 100, |
||||
|
valign: 'middle', |
||||
|
cellStyle: function () { |
||||
|
return {css: {"height": "50px", "color": "yellow"}} |
||||
|
} |
||||
|
|
||||
}, |
|
||||
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*) |
|
||||
pageNumber: 1, //初始化加载第一页,默认第一页 |
|
||||
pageSize: 10, //每页的记录行数(*) |
|
||||
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*) |
|
||||
search: false, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大 |
|
||||
searchTimeOut: 1000, |
|
||||
// : true, |
|
||||
showColumns: false, //是否显示所有的列 |
|
||||
showRefresh: false, //是否显示刷新按钮 |
|
||||
minimumCountColumns: 2, //最少允许的列数 |
|
||||
clickToSelect: true, //是否启用点击选中行 |
|
||||
singleSelect: true, |
|
||||
// height: 300, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度 |
|
||||
uniqueId: "id", //每一行的唯一标识,一般为主键列 |
|
||||
// showToggle: true, //是否显示详细视图和列表视图的切换按钮 |
|
||||
cardView: false, //是否显示详细视图 |
|
||||
detailView: false, //是否显示父子表 |
|
||||
|
}, { |
||||
|
field: 'transQty', |
||||
|
title: '入库数量', |
||||
|
width: 100, |
||||
|
valign: 'middle', |
||||
|
cellStyle: function () { |
||||
|
return {css: {"height": "50px", "color": "yellow"}} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
], |
||||
|
onLoadSuccess: function (data) { |
||||
|
|
||||
columns: [{ |
|
||||
field: 'cinvcname', |
|
||||
title: '存货大类', |
|
||||
width: 100, |
|
||||
cellStyle: function () { |
|
||||
return {css: {"height": "50px", "color": "yellow"}} |
|
||||
} |
|
||||
|
|
||||
}, { |
|
||||
field: 'transQty', |
|
||||
title: '入库数量', |
|
||||
width: 100, |
|
||||
cellStyle: function () { |
|
||||
return {css: {"height": "50px", "color": "yellow"}} |
|
||||
} |
|
||||
} |
|
||||
], |
|
||||
onLoadSuccess: function (data) { |
|
||||
// var height_param = $(window).height() - 125; |
|
||||
// $('#table3').parents('.fixed-table-container').css("height", height_param+"px"); |
|
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
tableInit3() { |
||||
|
$('#table1').bootstrapTable('destroy').bootstrapTable({ |
||||
|
striped: true, //是否显示行间隔色 |
||||
|
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*) |
||||
|
pagination: false, //是否显示分页(*) |
||||
|
sortable: false, //是否启用排序 |
||||
|
sortOrder: "asc", //排序方式 |
||||
|
queryParamsType: "undefined", //排序方式 |
||||
|
queryParams: function queryParams(params) { //设置查询参数 |
||||
|
|
||||
} |
|
||||
}); |
|
||||
|
}, |
||||
|
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*) |
||||
|
pageNumber: 1, //初始化加载第一页,默认第一页 |
||||
|
pageSize: 10, //每页的记录行数(*) |
||||
|
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*) |
||||
|
search: false, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大 |
||||
|
searchTimeOut: 1000, |
||||
|
// : true, |
||||
|
showColumns: false, //是否显示所有的列 |
||||
|
showRefresh: false, //是否显示刷新按钮 |
||||
|
minimumCountColumns: 2, //最少允许的列数 |
||||
|
clickToSelect: true, //是否启用点击选中行 |
||||
|
singleSelect: true, |
||||
|
// height: 300, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度 |
||||
|
uniqueId: "id", //每一行的唯一标识,一般为主键列 |
||||
|
// showToggle: true, //是否显示详细视图和列表视图的切换按钮 |
||||
|
cardView: false, //是否显示详细视图 |
||||
|
detailView: false, //是否显示父子表 |
||||
|
|
||||
|
|
||||
} |
|
||||
|
columns: [{ |
||||
|
field: 'cinvcname', |
||||
|
title: '存货大类', |
||||
|
width: 100, |
||||
|
cellStyle: function () { |
||||
|
return {css: {"height": "50px", "color": "yellow"}} |
||||
|
} |
||||
|
|
||||
|
}, { |
||||
|
field: 'transQty', |
||||
|
title: '入库数量', |
||||
|
width: 100, |
||||
|
cellStyle: function () { |
||||
|
return {css: {"height": "50px", "color": "yellow"}} |
||||
|
} |
||||
|
} |
||||
|
], |
||||
|
onLoadSuccess: function (data) { |
||||
|
// var height_param = $(window).height() - 125; |
||||
|
// $('#table3').parents('.fixed-table-container').css("height", height_param+"px"); |
||||
|
|
||||
}, |
|
||||
mounted() { |
|
||||
|
} |
||||
|
}); |
||||
|
|
||||
this.loadTime(); |
|
||||
this.load2(); |
|
||||
this.tableInit3(); |
|
||||
this.tableInit2(); |
|
||||
}, |
|
||||
destroyed() { |
|
||||
|
|
||||
clearInterval(this.handler); |
|
||||
clearTimeout(this.countTimer); |
|
||||
clearInterval(this.loader); |
|
||||
clearInterval(this.timer); |
|
||||
}, |
|
||||
beforeDestroy() { |
|
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
mounted() { |
||||
|
|
||||
|
this.loadTime(); |
||||
|
this.load2(); |
||||
|
this.tableInit3(); |
||||
|
this.tableInit2(); |
||||
|
}, |
||||
|
destroyed() { |
||||
|
|
||||
}, |
|
||||
} |
|
||||
|
clearInterval(this.handler); |
||||
|
clearTimeout(this.countTimer); |
||||
|
clearInterval(this.loader); |
||||
|
clearInterval(this.timer); |
||||
|
}, |
||||
|
beforeDestroy() { |
||||
|
|
||||
|
}, |
||||
|
} |
||||
</script> |
</script> |
||||
|
|
||||
<style scoped> |
<style scoped> |
||||
.container { |
|
||||
height: 100%; |
|
||||
} |
|
||||
|
.container { |
||||
|
height: 100%; |
||||
|
} |
||||
</style> |
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue