fix:减薄车间看板
This commit is contained in:
parent
89b64277f9
commit
f1ec1efa64
|
@ -15,14 +15,9 @@
|
|||
设备状态
|
||||
</div>
|
||||
<div class="boxlabel">
|
||||
<span class="stateIcon bwIcon"></span>
|
||||
<span>保温中</span>
|
||||
<span class="eqNum">{{hh.bw}}台</span>
|
||||
</div>
|
||||
<div class="boxlabel">
|
||||
<span class="stateIcon lqIcon"></span>
|
||||
<span>冷却中</span>
|
||||
<span class="eqNum">{{hh.lq}}台</span>
|
||||
<span class="stateIcon yxicon"></span>
|
||||
<span>运行中</span>
|
||||
<span class="eqNum">{{hh.yx}}台</span>
|
||||
</div>
|
||||
<div class="boxlabel">
|
||||
<span class="stateIcon wyxIcon"></span>
|
||||
|
@ -112,16 +107,16 @@
|
|||
<div class="totalStatic">
|
||||
<span class="totalStaticItem">日投产量</span>
|
||||
<span class="totalStaticItem">日加工数</span>
|
||||
<span class="totalStaticItem">日加工前不良数</span>
|
||||
<span class="totalStaticItem">日加工前不良</span>
|
||||
<span class="totalStaticItem">日合格数</span>
|
||||
<span class="totalStaticItem">日不合格数</span>
|
||||
</div>
|
||||
<div class="totalStatic">
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ kctj.dhh }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ kctj.hhz }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ kctj.thz }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ kctj.thok }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ kctj.thok }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ sctj.rtcs }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ sctj.rjgs }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ sctj.rjgqbls }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ sctj.rhgs }}</span>
|
||||
<span class="totalStaticItem totalStaticItemNum">{{ sctj.rbhgs }}</span>
|
||||
</div>
|
||||
<dv-scroll-board :config="configDatas" class="boxmain boxmainbottom" style="width:98%;margin:auto" />
|
||||
</div>
|
||||
|
@ -141,7 +136,7 @@ export default {
|
|||
components: { scScrollTavle },
|
||||
data() {
|
||||
return {
|
||||
basicOption: {
|
||||
barOption: {
|
||||
backgroundColor: "",
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
|
@ -155,63 +150,6 @@ export default {
|
|||
legend: {
|
||||
icon: "stack",
|
||||
right: 0,
|
||||
data: [
|
||||
{
|
||||
backgroundColor: "rgb(1,235,239)",
|
||||
name: "减薄",
|
||||
itemStyle: {
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(250,205,0)",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgb(254,129,0)",
|
||||
},
|
||||
]
|
||||
),
|
||||
},
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
},
|
||||
},
|
||||
{
|
||||
backgroundColor: "rgb(250,205,0)",
|
||||
name: "退火",
|
||||
itemStyle: {
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(1,235,239)",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgb(5, 158, 163)",
|
||||
},
|
||||
]
|
||||
),
|
||||
},
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
// saveAsImage: {}
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: "3%",
|
||||
|
@ -250,9 +188,8 @@ export default {
|
|||
},
|
||||
series: [
|
||||
{
|
||||
name: "今日统计",
|
||||
name: "加工数",
|
||||
type: "bar",
|
||||
// stack: "Ad",
|
||||
barWidth: 10,
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
|
@ -262,32 +199,11 @@ export default {
|
|||
position: "top",
|
||||
color: "#fff",
|
||||
},
|
||||
itemStyle: {
|
||||
borderRadius: [5, 5, 0, 0],
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(250,205,0)",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgb(254,129,0)",
|
||||
},
|
||||
]
|
||||
),
|
||||
},
|
||||
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
name: "合格数",
|
||||
type: "bar",
|
||||
// stack: "Ad",
|
||||
barWidth: 10,
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
|
@ -297,61 +213,72 @@ export default {
|
|||
position: "top",
|
||||
color: "#fff",
|
||||
},
|
||||
itemStyle: {
|
||||
borderRadius: [5, 5, 0, 0],
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(1,235,239)",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgb(5, 158, 163)",
|
||||
},
|
||||
]
|
||||
),
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "合格率",
|
||||
type: "bar",
|
||||
barWidth: 10,
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#fff",
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
],
|
||||
},
|
||||
pieOption: {
|
||||
backgroundColor: "",
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: {
|
||||
icon: "stack",
|
||||
right: 0,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '不合格占比',
|
||||
type: 'pie',
|
||||
radius: ['1%', '60%'],
|
||||
center: ['50%', '55%'],
|
||||
label: false,
|
||||
data: [
|
||||
{value: 0, name: '划伤'},
|
||||
{value: 0, name: '气泡'},
|
||||
{value: 0, name: '水纹'},
|
||||
{value: 0, name: '崩边'},
|
||||
{value: 0, name: '雾面'},
|
||||
{value: 0, name: '麻点'},
|
||||
{value: 0, name: '线痕'},
|
||||
{value: 0, name: '破损'},
|
||||
{value: 0, name: '其他'},
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
tableHeight: 100,
|
||||
speed: 2000,
|
||||
time: null,
|
||||
hh:{
|
||||
bw:0,
|
||||
lq:0,
|
||||
yx:0,
|
||||
wyx:0,
|
||||
gz:0,
|
||||
},
|
||||
th:{
|
||||
bw:0,
|
||||
lq:0,
|
||||
wyx:0,
|
||||
gz:0,
|
||||
},
|
||||
sctj_ysetday:{
|
||||
hh:0,
|
||||
th:0
|
||||
},
|
||||
tcfx:{
|
||||
yesterday:0,
|
||||
today:0,
|
||||
tomorrow:0,
|
||||
|
||||
},
|
||||
kctj:{
|
||||
dhh:0,
|
||||
hhz:0,
|
||||
thz:0,
|
||||
thok:0,
|
||||
|
||||
sctj:{
|
||||
rtcs:0,
|
||||
rjgs:0,
|
||||
rjgqbls:0,
|
||||
rhgs:0,
|
||||
rbhgs:0,
|
||||
},
|
||||
dayInterval: null,
|
||||
chartInterval1: null,
|
||||
chartInterval2: null,
|
||||
//库存
|
||||
configDataInm:{
|
||||
|
@ -386,7 +313,7 @@ export default {
|
|||
//生产统计
|
||||
configDatas :{
|
||||
headerBGC:'#0a3f44',
|
||||
header:['投产量','加工数','加工前不良数','合格数','不合格数'],
|
||||
header:['日期','加工数','合格数','不合格数'],
|
||||
headerHeight:40,
|
||||
data:[]
|
||||
},
|
||||
|
@ -395,9 +322,12 @@ export default {
|
|||
today: "",
|
||||
end_time:'',
|
||||
start_time:'',
|
||||
mgroups:[],
|
||||
daysList:[],
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
let that = this;
|
||||
//表格table的高度
|
||||
this.tableHeight = document.getElementById("scrollContainer").clientHeight;
|
||||
this.showTime();
|
||||
|
@ -412,26 +342,37 @@ export default {
|
|||
let dates = item.split('-');
|
||||
let obj = dates[1]+'-'+dates[2];
|
||||
xAxisData.push(obj);
|
||||
let dayitem = Number(dates[2]);
|
||||
that.daysList.push(dayitem);
|
||||
})
|
||||
console.log('that.daysList',that.daysList);
|
||||
that.today = new Date().toISOString().split('T')[0]
|
||||
// console.log('new Date', new Date().toISOString().split('T'))
|
||||
this.xAxisData = xAxisData;
|
||||
let startDate = new Date(daysArr[0]).getTime()-(1000*60*60*24);
|
||||
let endDate = new Date(daysArr[6]).getTime()+(1000*60*60*24);
|
||||
let start_time = this.$TOOL.dateFormat(new Date(startDate), "yyyy-MM-dd hh:mm:ss");
|
||||
let end_time = this.$TOOL.dateFormat(new Date(endDate), "yyyy-MM-dd hh:mm:ss");
|
||||
let start_time = this.$TOOL.dateFormat(new Date(startDate), "yyyy-MM-dd");
|
||||
let end_time = this.$TOOL.dateFormat(new Date(endDate), "yyyy-MM-dd");
|
||||
this.start_time = start_time;
|
||||
this.end_time = end_time;
|
||||
this.$nextTick(() => {
|
||||
//设备数据
|
||||
this.getEqState();
|
||||
this.$API.mtm.mgroup.list.req({page:0,belong_dept__name:'减薄车间'}).then((res) => {
|
||||
that.mgroups = res;
|
||||
that.configDataEq.data = [];
|
||||
that.configDataHandover.data = [];
|
||||
res.forEach((item)=>{
|
||||
//设备数据
|
||||
that.getEqState(item.id);
|
||||
//库存统计
|
||||
this.getMaterials(item.id);
|
||||
//交接列表
|
||||
this.getHandover(item.id);
|
||||
})
|
||||
})
|
||||
//任务进度
|
||||
this.getMtask();
|
||||
//库存统计
|
||||
this.getMaterials();
|
||||
//交接列表
|
||||
this.getHandover();
|
||||
//投产/生产分析
|
||||
this.getProductLine1();
|
||||
this.getProductLine2();
|
||||
this.getProductLine();
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
|
@ -461,7 +402,7 @@ export default {
|
|||
});
|
||||
}
|
||||
if (option == null) {
|
||||
option = Object.assign({}, this.basicOption);
|
||||
option = Object.assign({}, this.barOption);
|
||||
}
|
||||
setTimeout(() => {
|
||||
try {
|
||||
|
@ -471,32 +412,50 @@ export default {
|
|||
return myChart;
|
||||
},
|
||||
//投产分析
|
||||
getProductLine1() {
|
||||
getProductLine() {
|
||||
let that = this;
|
||||
let obj = {
|
||||
query: {start_time: that.start_time,end_time: that.end_time},
|
||||
query: {start_date: that.start_time,end_date: that.end_time,dept_name:'减薄车间'},
|
||||
};
|
||||
that.$API.bi.dataset.exec.req("thslrk", obj).then((res) => {
|
||||
that.$API.bi.dataset.exec.req("lineDay", obj).then((res) => {
|
||||
let list = res.data2.ds0;
|
||||
let seriesData1 = [];
|
||||
let seriesData0 = [],seriesData1 = [],seriesData2 = [];
|
||||
for (let i = 0; i < that.xAxisData.length; i++) {
|
||||
seriesData1[i] = 0;
|
||||
seriesData0[i] = 0;seriesData1[i] = 0;seriesData2[i] = 0;
|
||||
}
|
||||
if (list.length > 0) {
|
||||
list.forEach((item) => {
|
||||
let date = item.日期.split("-")[1]+'-'+item.日期.split("-")[2];
|
||||
let index = that.xAxisData.indexOf(date);
|
||||
seriesData1[index] = item.送料数+item.入库数;
|
||||
let arr = [];
|
||||
arr[0] = item.年+'-'+item.月+'-'+item.日;
|
||||
arr[1] = item.生产数;
|
||||
arr[2] = item.合格数;
|
||||
arr[3] = item.不合格数;
|
||||
that.configDatas.data.push(arr);
|
||||
|
||||
let indexs = that.daysList.indexOf(item.日);
|
||||
seriesData0[indexs] = item.生产数;
|
||||
seriesData1[indexs] = item.合格数;
|
||||
seriesData2[indexs] = item.合格率;
|
||||
that.pieOption.series.data[0].value += item.划伤;
|
||||
that.pieOption.series.data[1].value += item.气泡;
|
||||
that.pieOption.series.data[2].value += item.水纹;
|
||||
that.pieOption.series.data[3].value += item.崩边;
|
||||
that.pieOption.series.data[4].value += item.雾面;
|
||||
that.pieOption.series.data[5].value += item.麻点;
|
||||
that.pieOption.series.data[6].value += item.线痕;
|
||||
that.pieOption.series.data[7].value += item.破损;
|
||||
that.pieOption.series.data[8].value += item.其他;
|
||||
});
|
||||
}
|
||||
that.tcfx.yesterday = seriesData1[5];
|
||||
let chart1Option = deepCopy(this.basicOption);
|
||||
chart1Option.xAxis.data = that.xAxisData;
|
||||
chart1Option.series[0].data = seriesData1;
|
||||
let chart1 = this.setChart("chart1", chart1Option);
|
||||
let index1 = 0;
|
||||
this.chartInterval2 = setInterval(function () {
|
||||
if (index1 < chart1Option.series[0].data.length) {
|
||||
that.barOption.xAxis.data = that.xAxisData;
|
||||
that.barOption.series[0].data = seriesData0;
|
||||
that.barOption.series[1].data = seriesData1;
|
||||
that.barOption.series[2].data = seriesData2;
|
||||
let chart1 = this.setChart("chart1", that.barOption);
|
||||
let chart2 = this.setChart("chart2", that.pieOption);
|
||||
let index1 = 0,index2 = 0;
|
||||
this.chartInterval1 = setInterval(function () {
|
||||
if (index1 < that.barOption.series[0].data.length) {
|
||||
chart1.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
|
@ -516,41 +475,8 @@ export default {
|
|||
index1 = 0;
|
||||
}
|
||||
}, 3000);
|
||||
});
|
||||
},
|
||||
//生产分析
|
||||
getProductLine2() {
|
||||
let that = this;
|
||||
let obj = {
|
||||
query: {start_time: that.start_time,end_time: that.end_time},
|
||||
};
|
||||
that.$API.bi.dataset.exec.req("jltj", obj).then((res) => {
|
||||
let list = res.data2.ds0;
|
||||
let seriesData1 = [],seriesData2 = [];
|
||||
for (let i = 0; i < that.xAxisData.length; i++) {
|
||||
seriesData1[i] = 0;
|
||||
seriesData2[i] = 0;
|
||||
}
|
||||
if (list.length > 0) {
|
||||
list.forEach((item) => {
|
||||
let date = item.日期.split("-")[1]+'-'+item.日期.split("-")[2];
|
||||
let index = that.xAxisData.indexOf(date);
|
||||
seriesData1[index] = item.黑化数;
|
||||
seriesData2[index] = item.退火数;
|
||||
});
|
||||
}
|
||||
that.sctj_ysetday.hh = seriesData1[5];
|
||||
that.sctj_ysetday.th = seriesData2[5];
|
||||
let chart2Option = deepCopy(this.basicOption);
|
||||
chart2Option.xAxis.data = that.xAxisData;
|
||||
chart2Option.series[0].name = '黑化数';
|
||||
chart2Option.series[1].name = '退火数';
|
||||
chart2Option.series[0].data = seriesData1;
|
||||
chart2Option.series[1].data = seriesData2;
|
||||
let chart2 = this.setChart("chart2", chart2Option);
|
||||
let index2 = 0;
|
||||
this.chartInterval2 = setInterval(function () {
|
||||
if (index2 < chart2Option.series[0].data.length) {
|
||||
if (index2 < that.barOption.series[0].data.length) {
|
||||
chart2.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
|
@ -573,24 +499,22 @@ export default {
|
|||
});
|
||||
},
|
||||
//设备状态
|
||||
getEqState() {
|
||||
getEqState(id) {
|
||||
let that = this;
|
||||
that.$API.wpm.ana.equipLastMlog.req({mgroup_name: '减薄'}).then((res) => {
|
||||
that.$API.wpm.ana.equipLastMlog.req({mgroup:id}).then((res) => {
|
||||
that.hh.bw = res.保温;
|
||||
that.hh.lq = res.冷却;
|
||||
that.hh.yx = res.运行;
|
||||
that.hh.wyx = res.未运行;
|
||||
that.hh.gz = res.故障;
|
||||
that.configDataEq.data = [];
|
||||
let nowTime = new Date(res.now).getTime();
|
||||
if(res.rows.length>0){
|
||||
res.rows.forEach((item) => {
|
||||
let arr = [];
|
||||
arr[0] = item.name;
|
||||
arr[1] = item.number;
|
||||
if(item.mstate=='保温'){
|
||||
arr[2] = '<span style="color:rgb(245, 196, 0)">保温</span>';
|
||||
}else if(item.mstate=='冷却'){
|
||||
arr[2] = '<span style="color:rgb(0,163,245)">冷却</span>';
|
||||
if(item.mstate=='冷却'){
|
||||
arr[2] = '<span style="color:rgb(0,163,245)">运行中</span>';
|
||||
}else if(item.mstate=='未运行'){
|
||||
arr[2] = '<span style="color:rgb(69,176,118)">未运行</span>';
|
||||
}else if(item.mstate=='故障'){
|
||||
|
@ -626,7 +550,7 @@ export default {
|
|||
getMtask() {
|
||||
let that = this;
|
||||
let obj = {};
|
||||
obj.mgroup__name = '黑化';
|
||||
obj.mgroup__name = '减薄A,减薄B';
|
||||
obj.page = 0;
|
||||
that.$API.pm.mtask.list.req(obj).then((res) => {
|
||||
that.configDataTask.data = [];
|
||||
|
@ -652,13 +576,13 @@ export default {
|
|||
});
|
||||
},
|
||||
//交接列表
|
||||
getHandover() {
|
||||
getHandover(id) {
|
||||
let that = this;
|
||||
let obj = {};
|
||||
obj.mgroup__name = '减薄';
|
||||
obj.mgroup = id;
|
||||
obj.page = 0;
|
||||
obj.send_date =
|
||||
that.$API.wpm.handover.list.req(obj).then((res) => {
|
||||
that.configDataHandover.data = [];
|
||||
res.forEach((item) => {
|
||||
let arr = [];
|
||||
arr[0] = item.material_name;
|
||||
|
@ -683,7 +607,7 @@ export default {
|
|||
//库存统计列表
|
||||
getMaterials() {
|
||||
let that = this;
|
||||
that.$API.wpm.wmaterial.list.req({ page: 0,mgroup__name__in:'减薄' }).then((res) => {
|
||||
that.$API.wpm.wmaterial.list.req({ page: 0,mgroup__name__in:'减薄A,减薄B' }).then((res) => {
|
||||
that.configDataInm.data = [];
|
||||
if(res.length>0){
|
||||
res.forEach((item) => {
|
||||
|
@ -775,7 +699,7 @@ export default {
|
|||
.bwIcon{
|
||||
background-color: rgb(245, 196, 0);
|
||||
}
|
||||
.lqIcon{
|
||||
.lqIcon,.yxicon{
|
||||
background-color: rgb(0,163,245);
|
||||
}
|
||||
.wyxIcon{
|
||||
|
@ -791,7 +715,7 @@ export default {
|
|||
height: calc(100% - 50px);
|
||||
}
|
||||
.boxmain.boxmainbottom{
|
||||
height: calc(100% - 120px);
|
||||
height: calc(100% - 38px);
|
||||
}
|
||||
.lineDiv {
|
||||
height: 40px;
|
||||
|
|
Loading…
Reference in New Issue