生产管理
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user