生产数据
This commit is contained in:
@@ -1,30 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tag size="medium">{{ showTotal }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'TableTags',
|
||||
data() {
|
||||
return {
|
||||
showTotal: ''
|
||||
}
|
||||
},
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.injectData)
|
||||
console.log(this.injectData.prop)
|
||||
if (this.injectData.prop === 'ct1') {
|
||||
this.showTotal = this.injectData.ct1
|
||||
} else if (this.injectData.prop === 'ct2') {
|
||||
this.showTotal = this.injectData.ct2
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -34,7 +34,6 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chartDom: '',
|
||||
chart: '',
|
||||
chartHeight: tableHeight(446),
|
||||
list: [
|
||||
@@ -120,8 +119,8 @@ export default {
|
||||
) {
|
||||
this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
|
||||
}
|
||||
this.chartDom = document.getElementById('defectScatterPlotChart')
|
||||
this.chart = echarts.init(this.chartDom)
|
||||
var chartDom = document.getElementById('defectScatterPlotChart')
|
||||
this.chart = echarts.init(chartDom)
|
||||
let legendList = []
|
||||
let seriesList = []
|
||||
for (let i in this.defectMsg) {
|
||||
@@ -130,8 +129,8 @@ export default {
|
||||
let obj = {}
|
||||
for (let j of this.defectMsg[i]) {
|
||||
let arr2 = []
|
||||
arr2.push(parseInt(j.xpos))
|
||||
arr2.push(parseInt(j.ypos))
|
||||
arr2.push(parseInt(j.xpos))
|
||||
arr1.push(arr2)
|
||||
}
|
||||
obj.name = this.transLabel(i)
|
||||
@@ -169,6 +168,10 @@ export default {
|
||||
},
|
||||
itemWidth: 10 // 图例宽度
|
||||
},
|
||||
brush: {
|
||||
toolbox: ['rect', 'clear'],
|
||||
xAxisIndex: 0
|
||||
},
|
||||
grid: {
|
||||
x: 60,
|
||||
y: 60,
|
||||
@@ -187,7 +190,10 @@ export default {
|
||||
lineStyle: {
|
||||
color: 'rgba(0, 0, 0, 0.15)'
|
||||
}
|
||||
}
|
||||
},
|
||||
max: 2600,
|
||||
min: 0,
|
||||
interval: 100
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
@@ -201,30 +207,76 @@ export default {
|
||||
lineStyle: {
|
||||
color: 'rgba(0, 0, 0, 0.15)'
|
||||
}
|
||||
}
|
||||
},
|
||||
max: 2250,
|
||||
min: 0,
|
||||
interval: 100
|
||||
},
|
||||
series: seriesList
|
||||
// series: [
|
||||
// {
|
||||
// name: 'S',
|
||||
// type: 'scatter',
|
||||
// data: dataS,
|
||||
// symbolSize: 5
|
||||
// },
|
||||
// {
|
||||
// name: 'M',
|
||||
// type: 'scatter',
|
||||
// data: dataM,
|
||||
// symbolSize: 5
|
||||
// },
|
||||
// {
|
||||
// name: 'L',
|
||||
// type: 'scatter',
|
||||
// data: dataL,
|
||||
// symbolSize: 5
|
||||
// }
|
||||
// ]
|
||||
}
|
||||
let that = this
|
||||
this.chart.on('brushSelected', function (params) {
|
||||
var brushed = []
|
||||
var brushComponent = params.batch[0]
|
||||
var total = 0
|
||||
var xLong = 0
|
||||
var yLong = 0
|
||||
if (params.batch[0].areas[0]) {
|
||||
xLong = parseInt(
|
||||
params.batch[0].areas[0].coordRange[0][1] -
|
||||
params.batch[0].areas[0].coordRange[0][0]
|
||||
)
|
||||
yLong = parseInt(
|
||||
params.batch[0].areas[0].coordRange[1][1] -
|
||||
params.batch[0].areas[0].coordRange[1][0]
|
||||
)
|
||||
}
|
||||
for (var sIdx = 0; sIdx < brushComponent.selected.length; sIdx++) {
|
||||
var rawIndices = brushComponent.selected[sIdx].dataIndex.length
|
||||
total += rawIndices
|
||||
brushed.push(
|
||||
brushComponent.selected[sIdx].seriesName + ' : ' + rawIndices
|
||||
)
|
||||
}
|
||||
brushed.push('总计 : ' + total)
|
||||
that.chart.setOption({
|
||||
title: {
|
||||
backgroundColor: 'rgba(0, 0, 0, 0.5)',
|
||||
text: 'SELECTED DATA: \n' + brushed.join('\n'),
|
||||
right: params.batch[0].areas[0] ? '10%' : -100,
|
||||
bottom: params.batch[0].areas[0] ? 0 : -500,
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
fontWeight: 'normal',
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
graphic: [
|
||||
{
|
||||
type: 'group',
|
||||
left: params.batch[0].areas[0]
|
||||
? params.batch[0].areas[0].range[0][0]
|
||||
: -100,
|
||||
top: params.batch[0].areas[0]
|
||||
? params.batch[0].areas[0].range[1][1] + 5
|
||||
: -100,
|
||||
children: [
|
||||
{
|
||||
type: 'text',
|
||||
z: 100,
|
||||
style: {
|
||||
fill: '#333',
|
||||
width: 220,
|
||||
overflow: 'break',
|
||||
text: xLong + '*' + yLong,
|
||||
font: '12px Microsoft YaHei'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
})
|
||||
})
|
||||
option && this.chart.setOption(option)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,665 +0,0 @@
|
||||
<template>
|
||||
<div class="finalDataTable">
|
||||
<base-table :table-props="tablePropsT" :table-data="tableDataT" />
|
||||
<base-table :table-props="tablePropsB" :table-data="tableDataB" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
const tablePropsT = [
|
||||
{
|
||||
label: '尺寸',
|
||||
children: [
|
||||
{
|
||||
prop: 'name1',
|
||||
label: '面检缺陷',
|
||||
width: 110
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class1',
|
||||
children: [
|
||||
{
|
||||
prop: 'class1',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class2',
|
||||
children: [
|
||||
{
|
||||
prop: 'class2',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class3',
|
||||
children: [
|
||||
{
|
||||
prop: 'class3',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class4',
|
||||
children: [
|
||||
{
|
||||
prop: 'class4',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class5',
|
||||
children: [
|
||||
{
|
||||
prop: 'class5',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class6',
|
||||
children: [
|
||||
{
|
||||
prop: 'class6',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class7',
|
||||
children: [
|
||||
{
|
||||
prop: 'class7',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class8',
|
||||
children: [
|
||||
{
|
||||
prop: 'class8',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class9',
|
||||
children: [
|
||||
{
|
||||
prop: 'class9',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class10',
|
||||
children: [
|
||||
{
|
||||
prop: 'class10',
|
||||
label: '<10*25',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
prop: 'total',
|
||||
label: '总数',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
const tablePropsB = [
|
||||
{
|
||||
label: '尺寸',
|
||||
children: [
|
||||
{
|
||||
prop: 'name1',
|
||||
label: '面检缺陷',
|
||||
width: 110
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class1',
|
||||
children: [
|
||||
{
|
||||
prop: 'class1',
|
||||
label: '100-200',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class2',
|
||||
children: [
|
||||
{
|
||||
prop: 'class2',
|
||||
label: '200-500',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class3',
|
||||
children: [
|
||||
{
|
||||
prop: 'class3',
|
||||
label: '300-800',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class4',
|
||||
children: [
|
||||
{
|
||||
prop: 'class4',
|
||||
label: '500-1000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class5',
|
||||
children: [
|
||||
{
|
||||
prop: 'class5',
|
||||
label: '1000-2000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class6',
|
||||
children: [
|
||||
{
|
||||
prop: 'class6',
|
||||
label: '<1000-30000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class7',
|
||||
children: [
|
||||
{
|
||||
prop: 'class7',
|
||||
label: '1000-5000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class8',
|
||||
children: [
|
||||
{
|
||||
prop: 'class8',
|
||||
label: '1000-8000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class9',
|
||||
children: [
|
||||
{
|
||||
prop: 'class9',
|
||||
label: '1000-10000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'class10',
|
||||
children: [
|
||||
{
|
||||
prop: 'class10',
|
||||
label: '1000-10000',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
prop: 'total',
|
||||
label: '总数',
|
||||
minWidth: 70
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'FinalDataTable',
|
||||
data() {
|
||||
return {
|
||||
tablePropsT,
|
||||
tableDataT: [],
|
||||
tablePropsB,
|
||||
tableDataB: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
;(this.tableDataT = [
|
||||
{
|
||||
name1: 'BL',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Distortion',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Fiber',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'IIS rest',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Knot',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'PT',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Scratch',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Stone',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tail',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tin',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tin(Bottom)',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tin(Top)',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: '面检sum',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
}
|
||||
]),
|
||||
(this.tableDataB = [
|
||||
{
|
||||
name1: 'BL',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Distortion',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Fiber',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'IIS rest',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Knot',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'PT',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Scratch',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Stone',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tail',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tin',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tin(Bottom)',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: 'Tin(Top)',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
},
|
||||
{
|
||||
name1: '面检sum',
|
||||
class1: 0,
|
||||
class2: 2,
|
||||
class3: 54,
|
||||
class4: 0,
|
||||
class5: 0,
|
||||
class6: 0,
|
||||
class7: 7,
|
||||
class8: 0,
|
||||
class9: 0,
|
||||
class10: 0,
|
||||
total: 20
|
||||
}
|
||||
])
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.finalDataTable {
|
||||
.el-table thead.is-group tr:first-of-type th:first-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
.el-table thead.is-group tr:first-of-type th:first-of-type div.cell {
|
||||
text-align: right;
|
||||
}
|
||||
.el-table th.el-table__cell {
|
||||
height: 28px;
|
||||
}
|
||||
.el-table thead.is-group tr:first-of-type th:first-of-type:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 35px;
|
||||
top: 0;
|
||||
left: 48px;
|
||||
background-color: #ebeef5;
|
||||
transform: rotate(-35deg);
|
||||
-webkit-transform-origin: top;
|
||||
transform-origin: top;
|
||||
width: 1px;
|
||||
}
|
||||
.el-table thead.is-group tr:last-of-type th:first-of-type:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 35px;
|
||||
top: 0;
|
||||
left: 68px;
|
||||
background-color: #ebeef5;
|
||||
transform: rotate(-35deg);
|
||||
-webkit-transform-origin: top;
|
||||
transform-origin: top;
|
||||
width: 1px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,545 +0,0 @@
|
||||
<template>
|
||||
<div class="page-box">
|
||||
<search-bar
|
||||
:formConfigs="formConfig"
|
||||
ref="searchBarForm"
|
||||
@headBtnClick="buttonClick"
|
||||
/>
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-props="tableProp"
|
||||
:table-data="tableData"
|
||||
:span-method="spanMethod"
|
||||
:max-height="tableH"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { tableHeight } from '@/utils/index'
|
||||
import TableTags from './components/TableTags.vue'
|
||||
const tableProp = [
|
||||
{
|
||||
prop: 'process',
|
||||
label: '区域',
|
||||
fixed: true
|
||||
},
|
||||
{
|
||||
prop: 'equipmentName',
|
||||
label: '项目指标',
|
||||
minWidth: 150,
|
||||
fixed: true
|
||||
},
|
||||
{
|
||||
label: '白班(8:00-20:00)',
|
||||
align: 'center',
|
||||
children: [
|
||||
{ prop: 'b1', label: '7-8', width: 60 },
|
||||
{ prop: 'b2', label: '8-9', width: 60 },
|
||||
{ prop: 'b3', label: '9-10', width: 60 },
|
||||
{ prop: 'b4', label: '10-11', width: 60 },
|
||||
{ prop: 'b5', label: '11-12', width: 60 },
|
||||
{ prop: 'b6', label: '12-13', width: 60 },
|
||||
{ prop: 'b7', label: '13-14', width: 60 },
|
||||
{ prop: 'b8', label: '14-15', width: 60 },
|
||||
{ prop: 'b9', label: '15-16', width: 60 },
|
||||
{ prop: 'b10', label: '16-17', width: 60 },
|
||||
{ prop: 'b11', label: '17-18', width: 60 },
|
||||
{ prop: 'b12', label: '18-19', width: 60 },
|
||||
{ prop: 'ct1', label: '合计', subcomponent: TableTags }
|
||||
]
|
||||
},
|
||||
{
|
||||
label: '夜班(20:00-8:00)',
|
||||
align: 'center',
|
||||
children: [
|
||||
{ prop: 'y1', label: '19-20', width: 60 },
|
||||
{ prop: 'y2', label: '20-21', width: 60 },
|
||||
{ prop: 'y3', label: '21-22', width: 60 },
|
||||
{ prop: 'y4', label: '22-23', width: 60 },
|
||||
{ prop: 'y5', label: '23-24', width: 60 },
|
||||
{ prop: 'y6', label: '0-1', width: 60 },
|
||||
{ prop: 'y7', label: '1-2', width: 60 },
|
||||
{ prop: 'y8', label: '2-3', width: 60 },
|
||||
{ prop: 'y9', label: '3-4', width: 60 },
|
||||
{ prop: 'y10', label: '4-5', width: 60 },
|
||||
{ prop: 'y11', label: '5-6', width: 60 },
|
||||
{ prop: 'y12', label: '6-7', width: 60 },
|
||||
{ prop: 'ct2', label: '合计', subcomponent: TableTags }
|
||||
]
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'FinalInspectionDailyReport',
|
||||
data() {
|
||||
return {
|
||||
formConfig: [
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: '日期选择',
|
||||
dateType: 'date',
|
||||
format: 'yyyy-MM-dd',
|
||||
valueFormat: 'yyyy-MM-dd',
|
||||
param: 'timeVal',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '查询',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
},
|
||||
{
|
||||
type: 'separate'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '导出',
|
||||
name: 'export',
|
||||
color: 'primary',
|
||||
plain: true
|
||||
}
|
||||
],
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20
|
||||
},
|
||||
tableH: tableHeight(300),
|
||||
tableProp,
|
||||
tableData: [],
|
||||
span: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(300)
|
||||
})
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
},
|
||||
getData() {
|
||||
;(this.tableData = [
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 108,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 103,
|
||||
equipmentName: '上片投入数',
|
||||
process: '综合'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 102,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 99,
|
||||
equipmentName: '机器人投入数',
|
||||
process: '综合'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '良品总投入数',
|
||||
process: '综合'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '工序损耗',
|
||||
process: '综合'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '后清洗输出',
|
||||
process: '综合'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '上片损失',
|
||||
process: '上片'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '精切损失',
|
||||
process: '精切'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '精切抽检',
|
||||
process: '精切'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '磨边损失',
|
||||
process: '磨边'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '磨边抽检',
|
||||
process: '磨边'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '前清洗损失',
|
||||
process: '前清洗'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '边检损失',
|
||||
process: '边检'
|
||||
},
|
||||
{
|
||||
b1: 1,
|
||||
b2: 2,
|
||||
b3: 3,
|
||||
b4: 4,
|
||||
b5: 5,
|
||||
b6: 6,
|
||||
b7: 7,
|
||||
b8: 8,
|
||||
b9: 9,
|
||||
b10: 10,
|
||||
b11: 11,
|
||||
b12: 12,
|
||||
ct1: 100,
|
||||
y1: 1,
|
||||
y2: 2,
|
||||
y3: 3,
|
||||
y4: 4,
|
||||
y5: 5,
|
||||
y6: 6,
|
||||
y7: 7,
|
||||
y8: 8,
|
||||
y9: 9,
|
||||
y10: 10,
|
||||
y11: 11,
|
||||
y12: 12,
|
||||
ct2: 100,
|
||||
equipmentName: '复投损失',
|
||||
process: '复投'
|
||||
}
|
||||
]),
|
||||
this.getSpanArr(this.tableData)
|
||||
},
|
||||
getSpanArr(data) {
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
if (i === 0) {
|
||||
this.span.push(1)
|
||||
this.index = 0
|
||||
} else {
|
||||
if (data[i].process === data[i - 1].process) {
|
||||
this.span[this.index] += 1
|
||||
this.span.push(0)
|
||||
} else {
|
||||
this.span.push(1)
|
||||
this.index = i
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
spanMethod({ rowIndex, columnIndex }) {
|
||||
if (columnIndex === 1) {
|
||||
const _row = this.span[rowIndex]
|
||||
return {
|
||||
rowspan: _row,
|
||||
colspan: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -92,10 +92,13 @@ const tableProps = [
|
||||
fixed: 'left',
|
||||
minWidth: 120
|
||||
},
|
||||
{
|
||||
prop: 'package',
|
||||
label: '包装工位'
|
||||
},
|
||||
{
|
||||
prop: 'testTime',
|
||||
label: '检验时间',
|
||||
fixed: 'left',
|
||||
filter: timeFormatter,
|
||||
minWidth: 160
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user