root/screenkb-ruitaimagang
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

当月订单

Browse Source
This commit is contained in:
xiangxy
2023-12-01 13:38:35 +08:00
parent 728768cbc4
commit 58d774859b
1 changed files with 168 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

206
src/pages/proj/ProdCount.vue
View File

@@ -40,7 +40,7 @@
</div>
</div>
<div class="con3">
<div class="title"><span class="dotIncon"></span><span class="tltxt">人员月生产量</span></div>
<div class="title"><span class="dotIncon"></span><span class="tltxt">当月订单</span></div>
<div class="item_content_1">
<div id="echart_d2" style="width: 100%; height: 100%"></div>
</div>
@@ -89,6 +89,47 @@ export default {
materData: [],
deviceData: [],
PersonnelMonthlyProduction: [],
MonthlyWorkOrder: [
{guada_num: 1200, name: 'XC-0', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-1', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-2', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-3', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-4', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-5', order_num: 1655, residue_num: 455},
{guada_num: 1200, name: 'XC-6', order_num: 1655, residue_num: 455}
],
// MonthlyWorkOrder: [
// {
// name: 'A1',
// order_num: '150',
// guada_num: '100',
// residue_num: '50'
// },
// {
// name: 'A2',
// order_num: '130',
// guada_num: '120',
// residue_num: '10'
// },
// {
// name: 'A3',
// order_num: '300',
// guada_num: '30',
// residue_num: '270',
// },
// {
// name: 'A4',
// order_num: '150',
// guada_num: '100',
// residue_num: '50'
// },
// {
// name: 'A5',
// order_num: '300',
// guada_num: '100',
// residue_num: '200'
// }
// ],
ProductionTask: [],
ShiftProductionList: [],
resData: {}
@@ -133,7 +174,8 @@ export default {
this.showNum1 = (res.DayShiftList[0].plan_qty + '').split('')
this.showNum2 = (res.DayShiftList[0].real_qty + '').split('')
this.showNum3 = (res.DayShiftList[0].unqualified_qty + '').split('')
this.PersonnelMonthlyProduction = res.PersonnelMonthlyProduction
// this.PersonnelMonthlyProduction = res.PersonnelMonthlyProduction
// this.MonthlyWorkOrder = res.MonthlyWorkOrder
this.ProductionTask = res.ProductionTask
this.ShiftProductionList = res.ShiftProductionList
this.setEchart01()
@@ -323,10 +365,10 @@ export default {
}
},
setEchart02 () {
let max = 0
this.PersonnelMonthlyProduction.map(el => {
if (Number(el.real_qty) >= Number(max)) {
max = Number(el.real_qty)
let max = 1
this.MonthlyWorkOrder.map(el => {
if (Number(el.order_num) >= Number(max)) {
max = Number(el.order_num)
}
})
let option = {
@@ -337,14 +379,15 @@ export default {
bottom: 0,
containLabel: true
},
// dataZoom: [
// {
// show: false, // 为true滚动条出现
// type: 'slider', // type:'inside'，滚动条在最下面，鼠标点击滚动
// startValue: 0, // 从头开始。
// endValue: 5 // end百分比显示范围，endValue具体显示几个数值
// }
// ],
dataZoom: [
{
show: false, // 为true滚动条出现
type: 'slider', // type:'inside'，滚动条在最下面，鼠标点击滚动
orient: 'vertical',
startValue: 0, // 从头开始。
endValue: 3 // end百分比显示范围，endValue具体显示几个数值
}
],
xAxis: {
type: 'value',
min: 0,
@@ -394,43 +437,130 @@ export default {
fontSize: 14
}
},
data: this.PersonnelMonthlyProduction.map((it) => it.operator)
data: this.MonthlyWorkOrder.map((it) => it.name)
},
series: [
{
name: '房产',
type: 'bar',
barWidth: '16',
zlevel: 1,
label: {
show: true,
position: 'right', // 位置
color: '#A7D6F4',
fontSize: 14,
distance: 15, // 距离
formatter: '{c}' // 这里是数据展示的时候显示的数据
},
stack: '总量',
barWidth: 30,
itemStyle: {
normal: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [
{
offset: 0,
color: '#2DB796'
},
{
offset: 1,
color: '#6BBBA8'
}
], false)
// color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [
// {
// offset: 0,
// // color: '#f6b643'
// color: '#ed7d39'
// // color: '#EAAD24'
// },
// {
// offset: 1,
// color: '#ed7d39'
// // color: '#EAAD24'
// }
// ], false),
label: {
color: '#fff',
show: true,
position: 'inside'
}
}
},
data: this.PersonnelMonthlyProduction.map((it) => it.real_qty)
// data: [8, 10, 20, 20, 10, 10, 20],
data: this.MonthlyWorkOrder.map((it) => it.guada_num)
},
{
name: '土地',
type: 'bar',
stack: '总量',
itemStyle: {
normal: {
// color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [
// {
// offset: 0,
// color: '#94d153'
// // color: '#33CCCC'
// },
// {
// offset: 1,
// color: '#94d153'
// // color: '#33CCCC'
// }
// ], false),
label: {
color: '#333',
show: true,
position: 'inside'
// position: 'insideRight',
}
}
},
// data: [10, 20, 10, 10, 20, 20, 20],
data: this.MonthlyWorkOrder.map((it) => it.residue_num)
}
// {
// type: 'bar',
// barWidth: '16',
// zlevel: 1,
// label: {
// show: true,
// position: 'right', // 位置
// color: '#A7D6F4',
// fontSize: 14,
// distance: 15, // 距离
// formatter: '{c}' // 这里是数据展示的时候显示的数据
// },
// itemStyle: {
// normal: {
// color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [
// {
// offset: 0,
// color: '#2DB796'
// },
// {
// offset: 1,
// color: '#6BBBA8'
// }
// ], false)
// }
// },
// data: this.MonthlyWorkOrder.map((it) => it.order_num)
// },
// {
// type: 'bar',
// barWidth: '16',
// zlevel: 1,
// label: {
// show: true,
// position: 'right', // 位置
// color: '#A7D6F4',
// fontSize: 14,
// distance: 15, // 距离
// formatter: '{c}' // 这里是数据展示的时候显示的数据
// },
// itemStyle: {
// normal: {
// color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [
// {
// offset: 0,
// color: '#f6b643'
// },
// {
// offset: 1,
// color: '#ed7d39'
// }
// ], false)
// }
// },
// data: this.MonthlyWorkOrder.map((it) => it.guada_num)
// }
]
}
let echart = document.getElementById('echart_d2')
this.myCharts02 = this.$echarts.init(echart)
this.myCharts02.setOption(option)
// this.autoMove(option)
this.autoMove(option)
window.addEventListener('resize', () => {
this.myCharts02.resize()
})
@@ -444,7 +574,7 @@ export default {
option.dataZoom[0].endValue = option.dataZoom[0].endValue + 1
option.dataZoom[0].startValue = option.dataZoom[0].startValue + 1
}
this.myCharts01.setOption(option)
this.myCharts02.setOption(option)
}, 2000)
}
}