fix:减薄车间看板

This commit is contained in:
shijing 2025-02-10 16:55:10 +08:00
parent 89b64277f9
commit f1ec1efa64
1 changed files with 137 additions and 213 deletions

View File

@ -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;