427 lines
12 KiB
Vue
427 lines
12 KiB
Vue
<template>
|
||
<div class="thicknessReport">
|
||
<ul class="baseMsg">
|
||
<li><span>厚度检查机报表(此表接口还未调试)</span></li>
|
||
<li :title="glassId"><span>玻璃ID:</span>{{ glassId }}</li>
|
||
<li><span>检测时间:</span>2022.12.24 14:45:34</li>
|
||
<li><span>研磨类型:</span>4ABC</li>
|
||
</ul>
|
||
<base-table
|
||
:table-props="tableProps"
|
||
:table-data="tableDD"
|
||
:max-height="tableH"
|
||
:show-header="false"
|
||
/>
|
||
<button @click="exportData">导出,（开发自测用，后续会删除）</button>
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import { tableHeight } from '@/utils'
|
||
import * as XLSX from 'xlsx/xlsx.mjs'
|
||
import FileSaver from 'file-saver'
|
||
let tableProps = []
|
||
for (let j = 0; j < 21; j++) {
|
||
let obj = {}
|
||
obj.prop = 'a' + (j + 1)
|
||
obj.label = 'a' + (j + 1)
|
||
obj.minWidth = 75
|
||
tableProps.push(obj)
|
||
}
|
||
export default {
|
||
name: 'thickReport',
|
||
data() {
|
||
return {
|
||
tableProps,
|
||
tableH: tableHeight(292),
|
||
exportDD: [],
|
||
tableDD: [],
|
||
glassId: ''
|
||
}
|
||
},
|
||
mounted() {
|
||
window.addEventListener('resize', () => {
|
||
this.tableH = tableHeight(292)
|
||
})
|
||
this.getList()
|
||
},
|
||
props: {
|
||
tableData: {
|
||
type: Array,
|
||
required: true,
|
||
default: () => {
|
||
return []
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
getList() {
|
||
let exportD = Array(7)
|
||
.fill()
|
||
.map(() => Array(21))
|
||
let tableD = []
|
||
for (let j = 0; j < 7; j++) {
|
||
let obj = {
|
||
a1: '',
|
||
a2: '',
|
||
a3: '',
|
||
a4: '',
|
||
a5: '',
|
||
a6: '',
|
||
a7: '',
|
||
a8: '',
|
||
a9: '',
|
||
a10: '',
|
||
a11: '',
|
||
a12: '',
|
||
a13: '',
|
||
a14: '',
|
||
a15: '',
|
||
a16: '',
|
||
a17: '',
|
||
a18: '',
|
||
a19: '',
|
||
a20: '',
|
||
a21: ''
|
||
}
|
||
tableD.push(obj)
|
||
}
|
||
let mockData = [
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
},
|
||
{
|
||
glassId: '1212121212',
|
||
testTime: '2022-06-24T16:59:55',
|
||
grindType: '2AB',
|
||
thickOne: '502.457',
|
||
thickTwo: '503.226',
|
||
thickThree: '503.203',
|
||
thickFour: '502.220',
|
||
thickFive: '503.411',
|
||
thickSix: '500.904',
|
||
thickSeven: '499.810'
|
||
}
|
||
]
|
||
this.glassId = mockData[0].glassId
|
||
exportD.unshift(Array.from({ length: 21 }, () => null))
|
||
exportD[0][0] = '厚度检查机报表'
|
||
exportD[0][6] = '玻璃ID:'
|
||
exportD[0][8] = mockData[0].glassId
|
||
exportD[0][11] = '检测时间:'
|
||
exportD[0][13] = mockData[0].testTime
|
||
exportD[0][16] = '研磨类型:'
|
||
exportD[0][18] = mockData[0].grindType
|
||
for (let i = 0; i < mockData.length; i++) {
|
||
exportD[1][i] = mockData[i].thickOne
|
||
exportD[2][i] = mockData[i].thickTwo
|
||
exportD[3][i] = mockData[i].thickThree
|
||
exportD[4][i] = mockData[i].thickFour
|
||
exportD[5][i] = mockData[i].thickFive
|
||
exportD[6][i] = mockData[i].thickSix
|
||
exportD[7][i] = mockData[i].thickSeven
|
||
tableD[0]['a' + (i + 1)] = mockData[i].thickOne
|
||
tableD[1]['a' + (i + 1)] = mockData[i].thickTwo
|
||
tableD[2]['a' + (i + 1)] = mockData[i].thickThree
|
||
tableD[3]['a' + (i + 1)] = mockData[i].thickFour
|
||
tableD[4]['a' + (i + 1)] = mockData[i].thickFive
|
||
tableD[5]['a' + (i + 1)] = mockData[i].thickSix
|
||
tableD[6]['a' + (i + 1)] = mockData[i].thickSeven
|
||
}
|
||
console.log(exportD)
|
||
console.log(tableD)
|
||
this.exportDD = exportD
|
||
this.tableDD = tableD
|
||
},
|
||
exportData() {
|
||
const filename = '厚度表.xlsx'
|
||
const ws_name = 'Sheet1'
|
||
const wb = XLSX.utils.book_new()
|
||
const ws = XLSX.utils.aoa_to_sheet(this.exportDD)
|
||
XLSX.utils.book_append_sheet(wb, ws, ws_name)
|
||
ws['!merges'] = [
|
||
{ s: { r: 0, c: 0 }, e: { r: 0, c: 5 } },
|
||
{ s: { r: 0, c: 6 }, e: { r: 0, c: 7 } },
|
||
{ s: { r: 0, c: 8 }, e: { r: 0, c: 10 } },
|
||
{ s: { r: 0, c: 11 }, e: { r: 0, c: 12 } },
|
||
{ s: { r: 0, c: 13 }, e: { r: 0, c: 15 } },
|
||
{ s: { r: 0, c: 16 }, e: { r: 0, c: 17 } },
|
||
{ s: { r: 0, c: 18 }, e: { r: 0, c: 20 } }
|
||
]
|
||
let wbout = XLSX.write(wb, {
|
||
bookType: 'xlsx',
|
||
bookSST: false,
|
||
type: 'array'
|
||
})
|
||
FileSaver.saveAs(
|
||
new Blob([wbout], {
|
||
type: 'application/octet-stream'
|
||
}),
|
||
filename
|
||
)
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
.thicknessReport {
|
||
.baseMsg {
|
||
font-size: 14px;
|
||
height: 40px;
|
||
line-height: 40px;
|
||
display: flex;
|
||
border: 1px solid #e8e8e8;
|
||
border-radius: 4px;
|
||
margin-bottom: 20px;
|
||
li {
|
||
width: 25%;
|
||
text-align: center;
|
||
padding: 0 10px;
|
||
border-right: 1px solid #e8e8e8;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
span {
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|