生产管理

This commit is contained in:
‘937886381’
2025-10-24 11:19:34 +08:00
parent 463706663a
commit f11dfe04d5
29 changed files with 5927 additions and 1303 deletions

View File

@@ -3,7 +3,7 @@
<div class='line-container'>
<div class='table-box'>
<div class='title'>本班次</div>
<dv-scroll-board :config="config" style="width:600px;height:242px;margin-top: 10px;"/>
<dv-scroll-board ref="classToday" :config="classConfig" style="width:600px;height:242px;margin-top: 10px;" />
<span class='split-line' style='left: 66px;'></span>
<span class='split-line' style='left: 186px;'></span>
<span class='split-line' style='left: 311px;'></span>
@@ -11,7 +11,7 @@
</div>
<div class='table-box'>
<div class='title'>本日</div>
<dv-scroll-board :config="config" style="width:600px;height:242px;margin-top: 10px;"/>
<dv-scroll-board ref="day" :config="dayConfig" style="width:600px;height:242px;margin-top: 10px;" />
<span class='split-line' style='left: 66px;'></span>
<span class='split-line' style='left: 186px;'></span>
<span class='split-line' style='left: 311px;'></span>
@@ -19,7 +19,7 @@
</div>
<div class='table-box'>
<div class='title'>本周</div>
<dv-scroll-board :config="config" style="width:600px;height:242px;margin-top: 10px;"/>
<dv-scroll-board ref="week" :config="weekConfig" style="width:600px;height:242px;margin-top: 10px;" />
<span class='split-line' style='left: 66px;'></span>
<span class='split-line' style='left: 186px;'></span>
<span class='split-line' style='left: 311px;'></span>
@@ -27,7 +27,7 @@
</div>
<div class='table-box'>
<div class='title'>本月</div>
<dv-scroll-board :config="config" style="width:600px;height:242px;margin-top: 10px;"/>
<dv-scroll-board ref="month" :config="monthConfig" style="width:600px;height:242px;margin-top: 10px;" />
<span class='split-line' style='left: 66px;'></span>
<span class='split-line' style='left: 186px;'></span>
<span class='split-line' style='left: 311px;'></span>
@@ -43,9 +43,105 @@ export default {
components: {
ModelBox
},
props: {
dataObj: {
type: Object,
default: () => {}
}
},
watch: {
dataObj: {
handler(newVal, oldVal) {
console.log(newVal, 'newVal');
if (newVal) {
this.nowMonth = newVal.todayClass ? newVal.nowMonth.map((item, index) => [
`<span style="color:#000;" >${index + 1 || ''}
</span>`,
`<span style="color:#000;" >${item.name || ''}
</span>`,
// formatDate(item.planStartTime) || '',
`
<span style="color:#000;" >${item.inputNum || ''}
</span>`,
`<span style="color:#000;">${item.outputNum || ''}</span>`,
`<div style="width:136px; margin:0px;">
<div style="display:inline-block;height:8px; background:#D8DEEB; border-radius:4px; overflow:hidden;text-align:left;width:90px">
<div style="width:${item.inputOutputRate}%; height:100%; background:#0B58FF;border-radius:4px;"></div>
</div>
<span style="display:inline-block;margin-left:10px; color:#000; font-size:14px;">${item.inputOutputRate}%</span>
</div>`,
]) : []
this.monthConfig.data = this.nowMonth
this.$refs['month'].updateRows(this.nowMonth)
this.nowWeek = newVal.nowWeek ? newVal.nowWeek.map((item, index) => [
`<span style="color:#000;" >${index + 1 || ''}
</span>`,
`<span style="color:#000;" >${item.name || ''}
</span>`,
// formatDate(item.planStartTime) || '',
`
<span style="color:#000;" >${item.inputNum || ''}
</span>`,
`<span style="color:#000;">${item.outputNum || ''}</span>`,
`<div style="width:136px; margin:0px;">
<div style="display:inline-block;height:8px; background:#D8DEEB; border-radius:4px; overflow:hidden;text-align:left;width:90px">
<div style="width:${item.inputOutputRate}%; height:100%; background:#0B58FF;border-radius:4px;"></div>
</div>
<span style="display:inline-block;margin-left:10px; color:#000; font-size:14px;">${item.inputOutputRate}%</span>
</div>`,
]) : []
this.weekConfig.data = this.nowWeek
this.$refs['week'].updateRows(this.nowWeek)
this.oneDay = newVal.oneDay ? newVal.oneDay.map((item, index) => [
`<span style="color:#000;" >${index + 1 || ''}
</span>`,
`<span style="color:#000;" >${item.name || ''}
</span>`,
// formatDate(item.planStartTime) || '',
`
<span style="color:#000;" >${item.inputNum || ''}
</span>`,
`<span style="color:#000;">${item.outputNum || ''}</span>`,
`<div style="width:136px; margin:0px;">
<div style="display:inline-block;height:8px; background:#D8DEEB; border-radius:4px; overflow:hidden;text-align:left;width:90px">
<div style="width:${item.inputOutputRate}%; height:100%; background:#0B58FF;border-radius:4px;"></div>
</div>
<span style="display:inline-block;margin-left:10px; color:#000; font-size:14px;">${item.inputOutputRate}%</span>
</div>`,
]) : []
this.dayConfig.data = this.oneDay
this.$refs['day'].updateRows(this.oneDay)
this.todayClass = newVal.todayClass ? newVal.todayClass.map((item, index) => [
`<span style="color:#000;" >${index + 1 || ''}
</span>`,
`<span style="color:#000;" >${item.name || ''}
</span>`,
// formatDate(item.planStartTime) || '',
`
<span style="color:#000;" >${item.inputNum || ''}
</span>`,
`<span style="color:#000;">${item.outputNum || ''}</span>`,
`<div style="width:136px; margin:0px;">
<div style="display:inline-block;height:8px; background:#D8DEEB; border-radius:4px; overflow:hidden;text-align:left;width:90px">
<div style="width:${item.inputOutputRate}%; height:100%; background:#0B58FF;border-radius:4px;"></div>
</div>
<span style="display:inline-block;margin-left:10px; color:#000; font-size:14px;">${item.inputOutputRate}%</span>
</div>`,
]) : []
this.classConfig.data = this.todayClass
this.$refs['classToday'].updateRows(this.todayClass)
}
},
deep: true // 深度监听
}
},
data() {
return {
config:{
nowMonth: [],
nowWeek: [],
oneDay: [],
todayClass: [],
classConfig:{
header: ['<span style="color:#000;">序号</span>', '<span style="color:#000;">工段</span>', '<span style="color:#000;">投入数量/片</span>', '<span style="color:#000;">产出数量/片</span>','<span style="color:#000;">产出率/%</span>'],
headerHeight: 25,
headerBGC: '#E8EDF8',
@@ -55,41 +151,75 @@ export default {
columnWidth: [66, 120, 125, 126, 174],
align : ['center', 'center', 'center', 'center', 'center'],
data: []
},
monthConfig: {
header: ['<span style="color:#000;">序号</span>', '<span style="color:#000;">工段</span>', '<span style="color:#000;">投入数量/片</span>', '<span style="color:#000;">产出数量/片</span>', '<span style="color:#000;">产出率/%</span>'],
headerHeight: 25,
headerBGC: '#E8EDF8',
oddRowBGC: '#E8EDF8',
evenRowBGC: '#fff',
rowNum: 8,
columnWidth: [66, 120, 125, 126, 174],
align: ['center', 'center', 'center', 'center', 'center'],
data: []
},
dayConfig: {
header: ['<span style="color:#000;">序号</span>', '<span style="color:#000;">工段</span>', '<span style="color:#000;">投入数量/片</span>', '<span style="color:#000;">产出数量/片</span>', '<span style="color:#000;">产出率/%</span>'],
headerHeight: 25,
headerBGC: '#E8EDF8',
oddRowBGC: '#E8EDF8',
evenRowBGC: '#fff',
rowNum: 8,
columnWidth: [66, 120, 125, 126, 174],
align: ['center', 'center', 'center', 'center', 'center'],
data: []
},
weekConfig: {
header: ['<span style="color:#000;">序号</span>', '<span style="color:#000;">工段</span>', '<span style="color:#000;">投入数量/片</span>', '<span style="color:#000;">产出数量/片</span>', '<span style="color:#000;">产出率/%</span>'],
headerHeight: 25,
headerBGC: '#E8EDF8',
oddRowBGC: '#E8EDF8',
evenRowBGC: '#fff',
rowNum: 8,
columnWidth: [66, 120, 125, 126, 174],
align: ['center', 'center', 'center', 'center', 'center'],
data: []
}
}
},
mounted() {
this.getData()
this.getData()
},
methods: {
getData() {
let arr1 = []
let arr2 = []
let data = [
[1,'A1-磨边',234344,234333,100],
[2,'A1-磨边',234344,234333,10],
[3,'A1-磨边',234344,234333,96],
[4,'A1-磨边',234344,234333,20],
[5,'A1-磨边',234344,234333,40],
[6,'A1-磨边',234344,234333,90],
[7,'A1-磨边',234344,234333,80],
[8,'A1-磨边',234344,234333,80],
]
for (let i =0; i < data.length; i++) {
arr1.push(`<span style="color:#000;">${data[i][0]}</span>`)
arr1.push(`<span style="color:#000;">${data[i][1]}</span>`)
arr1.push(`<span style="color:#000;">${data[i][2]}</span>`)
arr1.push(`<span style="color:#000;">${data[i][3]}</span>`)
arr1.push(`<div style="width:136px; margin:0px;">
<div style="display:inline-block;height:8px; background:#D8DEEB; border-radius:4px; overflow:hidden;text-align:left;width:90px">
<div style="width:${data[i][4]}%; height:100%; background:#0B58FF;border-radius:4px;"></div>
</div>
<span style="display:inline-block;margin-left:10px; color:#000; font-size:14px;">${data[i][4]}%</span>
</div>`)
arr2.push(arr1)
arr1 = []
}
this.config.data = arr2
// let arr1 = []
// let arr2 = []
// let data = [
// [1,'A1-磨边',234344,234333,100],
// [2,'A1-磨边',234344,234333,10],
// [3,'A1-磨边',234344,234333,96],
// [4,'A1-磨边',234344,234333,20],
// [5,'A1-磨边',234344,234333,40],
// [6,'A1-磨边',234344,234333,90],
// [7,'A1-磨边',234344,234333,80],
// [8,'A1-磨边',234344,234333,80],
// ]
// for (let i =0; i < data.length; i++) {
// arr1.push(`<span style="color:#000;">${data[i][0]}</span>`)
// arr1.push(`<span style="color:#000;">${data[i][1]}</span>`)
// arr1.push(`<span style="color:#000;">${data[i][2]}</span>`)
// arr1.push(`<span style="color:#000;">${data[i][3]}</span>`)
// arr1.push(`<div style="width:136px; margin:0px;">
// <div style="display:inline-block;height:8px; background:#D8DEEB; border-radius:4px; overflow:hidden;text-align:left;width:90px">
// <div style="width:${data[i][4]}%; height:100%; background:#0B58FF;border-radius:4px;"></div>
// </div>
// <span style="display:inline-block;margin-left:10px; color:#000; font-size:14px;">${data[i][4]}%</span>
// </div>`)
// arr2.push(arr1)
// arr1 = []
// }
// this.config.data = arr2
}
}
}
@@ -127,4 +257,4 @@ export default {
}
}
}
</style>
</style>