@@ -417,13 +387,145 @@ import "animate.css";
const configData={
header : ['物料批次','未加工','进行中','已完成'],
headerBGC : '#0a3f44',
- rowNum : 8,
+ rowNum : 3,
headerHeight : 35,
align : 'center',
waitTime : 150000,
columnWidth: [110,70,70,70],
data : [],
}
+const baseOption={
+ color: ['rgb(255,160,0)','rgb(64,158,255)','rgb(54,256,158)'],
+ tooltip: {
+ trigger: 'item',
+ },
+ grid:{
+ top: '10%',
+ bottom: '10%',
+ },
+ xAxis:{
+ type: 'category',
+ axisLine: {
+ lineStyle: {
+ color: '#fff',
+ }
+ },
+ axisLabel: {
+ interval: 0,
+ rotate: 40,
+ fontSize: 10,
+ color: '#fff',
+ },
+ data:[1,2,3,4,5,6,7]
+ },
+ yAxis:[
+ {
+ type: 'value',
+ name: '数量',
+ axisLine: {
+ lineStyle: {
+ color: '#fff',
+ }
+ },
+ axisLabel: {
+ fontSize: 10,
+ color: '#fff',
+ },
+
+ },
+ {
+ type: "value",
+ name: "合格率",
+ position: "right",
+ alignTicks: true,
+ offset: 0,
+ axisLine: {
+ show: true,
+ lineStyle: {
+ fontSize: 8,
+ color: "rgb(54,256,158)",
+ },
+ },
+ axisLabel: {
+ formatter: "{value}",
+ },
+ }
+ ],
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '0.5%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
+ series: [
+ {
+ name:'生产数',
+ type: 'bar',
+ barWidth: 10,
+ yAxisIndex: 0,
+ itemStyle: {
+ borderRadius: [ 5, 5, 0,0]
+ },
+ data: [0,0,0,0,0,0,0]
+ },
+ {
+ name: '合格数',
+ type: 'bar',
+ barWidth: 10,
+ yAxisIndex: 0,
+ itemStyle: {
+ borderRadius: [ 5, 5, 0,0]
+ },
+ data: [0,0,0,0,0,0,0]
+ },
+ {
+ name: '合格率',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [0,0,0,0,0,0,0]
+ }
+ ]
+}
+const baseOption2= {
+ title: {
+ text: '总计',
+ left: 'center',
+ textStyle:{
+ fontSize: 16,
+ color: '#fff',
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ },
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '1%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
+ series: [{
+ type: 'pie',
+ radius: ['40%', '70%'],
+ center: ['50%', '50%'],
+ label: false,
+ itemStyle: {
+ borderRadius: 5
+ },
+ data: [
+ {value: 860, name: '合格'},
+ {value: 10, name: '不合格'},
+ ]
+ }]
+}
export default {
components: {
scEcharts
@@ -484,21 +586,29 @@ export default {
options: {
title: {
text: '总计',
+ left: 'center',
textStyle:{
+ fontSize: 16,
color: '#fff',
}
-
- },
- grid: {
- top: '5%'
},
tooltip: {
trigger: 'item',
},
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '1%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
series: [{
type: 'pie',
radius: ['40%', '70%'],
- center: ['50%', '60%'],
+ center: ['50%', '50%'],
label: false,
itemStyle: {
borderRadius: 5
@@ -512,20 +622,29 @@ export default {
option1: {
title: {
text: '尺寸早班',
+ left: 'center',
textStyle:{
+ fontSize: 16,
color: '#fff',
}
},
- grid: {
- top: '5%'
- },
tooltip: {
trigger: 'item',
},
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '1%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
series: [{
type: 'pie',
radius: ['40%', '70%'],
- center: ['50%', '60%'],
+ center: ['50%', '50%'],
label: false,
itemStyle: {
borderRadius: 5
@@ -539,20 +658,29 @@ export default {
option2: {
title: {
text: '尺寸晚班',
+ left: 'center',
textStyle:{
+ fontSize: 16,
color: '#fff',
}
},
- grid: {
- top: '5%'
- },
tooltip: {
trigger: 'item',
},
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '1%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
series: [{
type: 'pie',
radius: ['40%', '70%'],
- center: ['50%', '60%'],
+ center: ['50%', '50%'],
label: false,
itemStyle: {
borderRadius: 5
@@ -566,20 +694,29 @@ export default {
option3: {
title: {
text: '外观早班',
+ left: 'center',
textStyle:{
+ fontSize: 16,
color: '#fff',
}
},
- grid: {
- top: '5%'
- },
tooltip: {
trigger: 'item',
},
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '1%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
series: [{
type: 'pie',
radius: ['40%', '70%'],
- center: ['50%', '60%'],
+ center: ['50%', '50%'],
label: false,
itemStyle: {
borderRadius: 5
@@ -593,20 +730,29 @@ export default {
option4: {
title: {
text: '外观晚班',
+ left: 'center',
textStyle:{
+ fontSize: 16,
color: '#fff',
}
},
- grid: {
- top: '5%'
- },
tooltip: {
trigger: 'item',
},
+ legend: {
+ itemWidth: 12,
+ itemHeight: 12,
+ left: 'center',
+ bottom: '1%',
+ textStyle: {
+ color: '#fff',
+ fontSize: 10,
+ },
+ },
series: [{
type: 'pie',
radius: ['40%', '70%'],
- center: ['50%', '60%'],
+ center: ['50%', '50%'],
label: false,
itemStyle: {
borderRadius: 5
@@ -682,6 +828,7 @@ export default {
data:[],
rowNum : 3,
waitTime:3000,
+ columnWidth: [260,260,100],
},
configData30:{
header:['物料名称','物料批次','物料数量'],
@@ -691,6 +838,7 @@ export default {
data:[],
rowNum : 3,
waitTime:3000,
+ columnWidth: [260,260,100],
},
configData0:{},
configData1:{},
@@ -710,10 +858,28 @@ export default {
configData15:{},
scrollNum:0,
scrollInterval:null,
+ dayArr:[],
+ options0:{},
+ options1:{},
+ options2:{},
+ options3:{},
+ options4:{},
+ options5:{},
+ options6:{},
+ options7:{},
+ options8:{},
+ options9:{},
+ options10:{},
+ options11:{},
+ options12:{},
+ options13:{},
+ options14:{},
+ options15:{},
};
},
mounted() {
let that = this;
+ that.options0 = that.deepCopy(baseOption);
that.initFactory();
that.bigScreenName = that.$TOOL.data.get("BASE_INFO").base.bigScreen_name;
that.showTime();
@@ -727,12 +893,21 @@ export default {
that.currentYear = year;
that.currentMonth = month;
that.currentDay = day;
+ let dayArr = [];
+ for(let i=6;i>0;i--){
+ let date = new Date(nowDate.getTime()-i*24*60*60*1000);
+ let day = date.getDate();
+ dayArr.push(day);
+ }
+ dayArr.push(day);
+ that.dayArr = dayArr;
that.getEquipments();
that.getMaterials();
that.getMgroup();
that.getTaskNumber();
that.addListener();
that.setIntervalFun();
+ that.getQulity();
that.myChart = echarts.init(document.getElementById('eqPieChart'));
that.myChart.setOption(that.option_eq);
let index2 = 0;
@@ -759,6 +934,55 @@ export default {
}, 3000);
},
methods: {
+ getQulity(){
+ let that = this;
+ let month = that.currentMonth>9?that.currentMonth:'0'+that.currentMonth;
+ let day = that.currentDay>9?that.currentDay:'0'+that.currentDay;
+ let current_date = that.currentYear+'-'+month+'-'+day;
+ let obj = {
+ query:{
+ "fw_type":"prod",
+ "end_date":current_date,
+ "start_date":current_date,
+ "group_by_dept": ", dept.id",
+ "group_by_shift": ", shift.id",
+ "select_col_dept": ", dept.name as 部门",
+ "select_col_shift": ", shift.name as 班次"
+ },
+ };
+ that.$API.bi.dataset.exec.req('ftestDay2', obj).then((res) => {
+ if(res.data2.ds0){
+ let lists = res.data2.ds0;
+ //根据工段名称分组
+ if(lists.length>0){
+ let count_ok = 0,count_notok=0;
+ lists.forEach((item) => {
+ count_ok += item.合格数;
+ count_notok += item.不合格数;
+ let index = 1;
+ if(item.班次=='早班'&&item.部门=='尺寸检测'){
+ index = 1;
+ }else if(item.班次=='晚班'&&item.部门=='尺寸检测'){
+ index = 2;
+ }else if(item.班次=='早班'&&item.部门=='外观检测'){
+ index = 3;
+ }else if(item.班次=='晚班'&&item.部门=='外观检测'){
+ index = 4;
+ }
+ let key = 'option'+index;
+ that[key] = that.deepCopy(baseOption2);
+ that[key].title.text = item.班次+' '+item.部门;
+ that[key].series.data[0].value = item.合格数;
+ that[key].series.data[1].value = item.不合格数;
+ })
+ that.options = that.deepCopy(baseOption2);
+ that.options.series.data[0].value = count_ok;
+ that.options.series.data[1].value = count_notok;
+ }
+
+ }
+ });
+ },
setIntervalFun(){
let that = this;
that.scrollInterval = setInterval(() => {
@@ -767,10 +991,10 @@ export default {
}else{
that.scrollNum++;
}
- let nums = that.scrollNum * 320;
+ let nums = that.scrollNum * 384;
let lefts = 0-nums;
document.getElementById("scroll").style.left = lefts +'px';
- },15000)
+ },150000)
},
showTime() {
this.currentTime = this.$TOOL.dateFormat(new Date(), "hh:mm:ss");
@@ -1031,6 +1255,7 @@ export default {
for(let i=0;i
{
+ if(res.data2.ds0){
+ let lists = res.data2.ds0;
+ let optionKey = 'options'+index;
+ that[optionKey] = that.deepCopy(baseOption);
+ let data0=[],data1=[],data2=[];
+ if(lists.length>0){
+ lists.forEach((item) => {
+ let index = that.dayArr.indexOf(item.日);
+ data0[index] = item.生产数;
+ data1[index] = item.合格数;
+ data2[index] = item.合格率;
+ })
+ that[optionKey].series[0].data = data0;
+ that[optionKey].series[1].data = data1;
+ that[optionKey].series[2].data = data2;
+ }
+
+
}
});
},
@@ -1123,7 +1377,7 @@ export default {
z-index: -1;position: absolute;top:0;left:0;width:1920px;height:70px;
}
.header_line{
- top:75px;
+ top:65px;
height: 1px;
position: absolute;
background: rgb(54,217,187);
@@ -1143,30 +1397,31 @@ export default {
.left_block2,
.right_block{
top:74px;
- width:240px;
+ width:320px;
z-index: 10;
display: flex;
position:absolute;
overflow:hidden;
flex-direction: column;
- padding: 0 10px ;
+ padding: 0 5px;
height: 320px;
+ box-sizing: border-box;
background: rgba(9, 31, 43, 0.5);
}
.left_block3{
top:340px;
left: 0;
- width:480px;
+ width:640px;
display: flex;
position:absolute;
overflow:hidden;
flex-direction: column;
- padding: 0 4px;
+ padding: 0 5px;
height: 400px;
background: rgba(9, 31, 43, 0.5);
}
.left_block3 .flexItem{
- width:480px;
+ width:630px;
}
.left_block {
left: 0;
@@ -1174,23 +1429,27 @@ export default {
}
.right_block {
right: 0;
- width:480px;
+ width:640px;
height: 670px;
}
.left_block2{
- left: 240px;
+ left: 320px;
height: 270px;
+ padding: 0 5px;
+}
+.left_block2 .flexItem{
+ width:310px;
}
.flexItem{
- width: 240px;
+ width: 310px;
}
.videoFlexItem{
- width: 460px;
- height: 315px;
+ width: 630px;
+ height: 400px;
}
.newsFlexItem{
- width: 460px;
- height: 355px;
+ width: 620px;
+ height: 270px;
}
/* //短标题 */
.itemTitle{
@@ -1219,13 +1478,13 @@ export default {
.itemTitle_b{
height: 40px;
line-height: 40px;
- width: 310px;
+ width: 370px;
font-size: 14px;
padding-left: 2.5em;
}
.block1NumberWrap{
- width:48%;
+ width:135px;
border: 1px solid rgba(54, 217, 187, 0.3);
padding: 3px;
text-align: center;
@@ -1255,10 +1514,7 @@ export default {
.itemBody {
width: 100%;
border-radius: 20px;
- margin-top: 5px;
-}
-.flexItem3>.itemBody{
- margin-top: 0;
+ /* margin-top: 5px; */
}
.itemBody1{
display: flex;
@@ -1274,6 +1530,8 @@ export default {
}
.boxmain{
height: 140px;
+ width:100%;
+ margin:auto;
}
/* 下面的工序表模块 */
.bottom_block{
@@ -1295,13 +1553,42 @@ export default {
}
.flexItem3 {
- width: 320px;
+ width: 384px;
height: 340px;
+ position: relative;
background: rgba(9, 31, 43, 0.5)
}
+.flexItem3_title{
+ left: 50%;
+ width: 150px;
+ height: 30px;
+ line-height: 30px;
+ font-size: 16px;
+ color: #00ffff;
+ text-align: center;
+ border: 1px solid #00ffff;
+ border-radius: 5px;
+ box-shadow: inset 0 0 5px 5px rgb(0 255 255 / 32%);
+ z-index: 99;
+ position: absolute;
+ top: 0;
+ transform: translateX(-50%);
+ background: rgb(4 50 83);
+}
+.flexItem3Body{
+ width: 380px;
+ height: 315px;
+ padding-top: 25px;
+ border: 1px solid #00ffff;
+ border-radius: 5px;
+ position: absolute;
+ top: 15px;
+ box-shadow: inset 0 0 15px 5px rgb(0 255 255 / 32%);
+}
+
.inmBoxmain{
flex: 1;
- height: 270px;
+ height:140px;
width:98%;
margin:auto;
/* border-left: 2px solid #0f5b8e; */
@@ -1312,26 +1599,25 @@ export default {
}
.viewsItem {
color: #ffffff;
- font-size: 20px;
- width: 440px;
- height: 80px;
- font-size: 15px;
- display: inline-block;
- margin-bottom: 20px;
+ width: 620px;
+ height: 100px;
+ font-size: 15px;
+ display: inline-block;
+ margin-bottom: 10px;
}
.viewsItem_wrap {
- height: 70px;
- /* display: flex; */
+ height: 100px;
flex-direction: column;
- border-left: 5px solid rgba(53, 156, 193, 0.66);
+ border-left: 5px solid rgba(28, 169, 231, 0.81);
padding-left: 10px;
border-radius: 5px;
}
.viewsItem_img{
width: 85px;
- /* height: 50px; */
+ margin-top: 10px;
}
article{
+ margin-top: 5px;
text-indent: 2em;
}