Commit b8d5d9d6 authored by jingnan's avatar jingnan 👀

胶漆打印标签修改

parent 5dd15632
......@@ -13,17 +13,23 @@
:lay-config="cmpOptions"
:basic-data="basicData"
/>
<PrintTag ref="print" :config="printConfig" />
<PrintTagLacquer ref="printConfigLacquer" :config="printConfigLacquer" />
<PrintConfigPaint ref="printConfigPaint" :config="printConfigPaint" />
<PrintConfigAlodine ref="printConfigAlodine" :config="printConfigAlodine" />
</div>
</template>
<script>
import PrintTag from './printTag'
import PrintTagLacquer from './printTagLacquer'
import PrintConfigPaint from './printConfigPaint'
import PrintConfigAlodine from './printConfigAlodine'
import { post } from '@/utils/http'
export default {
name: 'AssignCradInfo',
componentName: '调配卡详情',
components: {
PrintTag
PrintTagLacquer,
PrintConfigPaint,
PrintConfigAlodine
},
props: {
basicData: {
......@@ -34,7 +40,17 @@ export default {
data() {
return {
cmpOptions: {},
printConfig: {
printConfigLacquer: {
visible: false,
width: 260,
prints: []
},
printConfigPaint: {
visible: false,
width: 260,
prints: []
},
printConfigAlodine: {
visible: false,
width: 260,
prints: []
......@@ -50,8 +66,8 @@ export default {
handler: function(val) {
if (val.subTypeName === 'AssignCardAlodine') {
this.cmpOptions = {
typeName: 'AssignCardAlodine',
layKey: 'assignCardInfo'
typeName: 'AssignCard',
layKey: 'assignCardAlodineDetailView'
}
} else if (val.subTypeName === 'AssignCardLacquer') {
this.cmpOptions = {
......@@ -103,24 +119,36 @@ export default {
post('/AssignCard/qualification', params)
.then((res) => {
var data = res.items.content[0]
this.printConfig = Object.assign({}, this.printConfig, {
visible: true
})
var b = data.validityEnd && data.validityEnd.split(':') || []
b.pop()
if (data.subTypeName === 'AssignCardPaint') {
if (data.subTypeName === 'AssignCardPaint') { // 调漆
this.printConfigPaint = Object.assign({}, this.printConfigPaint, {
visible: true
})
const a = data.validityStart && data.validityStart.split(':') || []
a.pop()
this.printConfig.prints = [
this.printConfigPaint.prints = [
{
text: data.cardNo,
title: '漆料合格标签',
count: data.actualWeight,
count: { label: '领取量', value: data.actualWeight },
number: { label: '编号', value: data.cardNo },
mark: { label: '油漆牌号', value: data.modelNo },
mixingUnit: { label: '调配单位', value: data.assignUnit },
standard: {
label: '材料规范',
value: this.form.standard
},
mark: {
label: '材料标识/牌号',
value: data.modelNo + '/' + data.realityMark
},
mixingUnit: {
label: '合格证编号',
value: data.certificateNo
},
// mark: { label: '油漆牌号', value: data.modelNo },
mixStartTime: { label: '混合开始时间', value: data.mixStartTime },
validity: {
label: '有效期',
label: '漆料施工有效期',
value: {
start: {
label: '始',
......@@ -132,27 +160,35 @@ export default {
}
}
},
deployment: { label: '调配员', value: data.creator.userName },
deployment: { label: '发料员', value: data.creator.userName },
inspector: {
label: '检验员',
value: data.checker
}
}
]
} else if (data.subTypeName === 'AssignCardAlodine') {
this.$refs.printConfigPaint.print()
} else if (data.subTypeName === 'AssignCardAlodine') { // 阿洛丁
this.printConfigAlodine = Object.assign({}, this.printConfigAlodine, {
visible: true
})
const c = (data.assignTime && data.assignTime.split(':')) || []
c.pop()
this.printConfig.prints = [
this.printConfigAlodine.prints = [
{
text: data.cardNo,
title: '阿洛丁刷涂合格标签',
count: data.assignTotalAmount,
count: { label: '领取量', value: data.assignTotalAmount },
number: { label: '编号', value: data.cardNo },
mark: {
label: '阿洛丁牌号',
value: data.modelNo
},
mixingUnit: { label: '调配单位', value: data.assignUnit },
mixingUnit: {
label: '合格证编号',
value: data.certificateNo
},
receiveDate: { label: '领取日期', value: data.assignUnit || 'xxxx-xx-xx hh:mm' },
validity: {
label: '有效期',
value: {
......@@ -166,23 +202,29 @@ export default {
}
}
},
deployment: { label: '调配员', value: data.creator.userName },
deployment: { label: '发料员', value: data.creator.userName },
inspector: {
label: '检验员',
value: data.checker
}
},
remark: { label: '备注',
value: data.realityMark }
}
]
} else if (data.subTypeName === 'AssignCardLacquer') {
this.$refs.printConfigAlodine.print()
} else if (data.subTypeName === 'AssignCardLacquer') { // 调胶
this.printConfigLacquer = Object.assign({}, this.printConfigLacquer, {
visible: true
})
const d = (data.mixStartTime && data.mixStartTime.split(':')) || []
d.pop()
const e = (data.mixEndTime && data.mixEndTime.split(':')) || []
e.pop()
this.printConfig.prints = [
this.printConfigLacquer.prints = [
{
text: data.cardNo,
title: '密封剂合格标签',
count: data.actualWeight,
count: { label: '重量', value: data.actualWeight },
number: { label: '编号', value: data.cardNo },
standard: {
label: '材料规范',
......@@ -216,8 +258,8 @@ export default {
}
}
]
this.$refs.printConfigLacquer.print()
}
this.$refs.print.print()
})
.catch((err) => console.log(err))
......
<template>
<section ref="print" class="print">
<section>
<div
v-for="(item, index) in config.prints"
:key="index"
style="
border: 2px solid #222;
box-sizing: border-box;
font-weight: 500;
font-size: 36px;
"
>
<div style="border-bottom: 2px solid #222">
<div
style="
display: inline-block;
border-right: 2px solid #222;
width: 70%;
vertical-align: top;
"
>
<!-- 第一行 -->
<div
style="
height: 76px;
border-bottom: 2px solid #222;
line-height: 76px;
"
>
<!-- 标题 -->
<div
style="
display: inline-block;
width: 40%;
text-align: center;
box-sizing: border-box;
border-right: 2px solid #222;
font-size: 40px;
"
>
{{ item.title }}
</div>
<!-- 编号 -->
<div
style="
display: inline-block;
vertical-align: top;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.number.label }}
</div>
<div
style="
display: inline-block;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.number.value }}
</div>
</div>
<!-- 第二行 -->
<div
style="
height: 76px;
display: flex;
align-items: center;
border-bottom: 2px solid #222;
"
>
<!-- 阿洛丁牌号 -->
<div
style="
display: inline-block;
width: 30%;
height: 76px;
line-height: 76px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mark.label }}
</div>
<div
style="
display: inline-block;
height: 76px;
line-height: 76px;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.mark.value }}
</div>
</div>
<!-- 第三行 -->
<div
style="
height: 76px;
display: flex;
align-items: center;
border-bottom: 2px solid #222;
"
>
<!-- 合格证编号 -->
<div
style="
vertical-align: top;
display: inline-block;
width: 30%;
height: 76px;
line-height: 76px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mixingUnit.label }}
</div>
<div
style="
display: inline-block;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.mixingUnit.value }}
</div>
</div>
<!-- 第四行 -->
<div
style="height: 76px; box-sizing: border-box; "
>
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 30%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.receiveDate.label }}
</div>
<div
style="
display: inline-block;
width: 40%;
line-height: 76px;
padding-left: 10px;
vertical-align: top;
border-right: 2px solid #222;
box-sizing: border-box;
"
>
{{ item.receiveDate.value }}
</div>
<!-- 数量 -->
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.count.label }}
</div>
<div
style="
display: inline-block;
line-height: 76px;
box-sizing: border-box;
padding-left: 20px;
"
>
{{ item.count.value }}
</div>
</div>
</div>
<!-- 二维码 -->
<div
style="
display: inline-block;
padding: 38px 50px;
width: 29%;
box-sizing: border-box;
"
>
<vue-qr
style="height:236px;"
:size="config.width"
:margin="0"
:text="item.text"
:qid="index.toString()"
/>
</div>
</div>
<!-- 施工期 -->
<div
style="height: 120px; box-sizing: border-box"
>
<div
style="
display: inline-block;
width: 21%;
border-right: 2px solid #222;
text-align: center;
line-height: 120px;
box-sizing: border-box;
vertical-align: top;
"
>
{{ item.validity.label }}
</div>
<div
style="
display: inline-block;
width: 79%;
line-height: 60px;
vertical-align: top;
"
>
<div
style="
display: inline-block;
border-bottom: 2px solid #222;
box-sizing: border-box;
width: 100%;"
>
<!-- 始 -->
<div
style="
display: inline-block;
width: 10%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.label }}
</div>
<div
style="
display: inline-block;
width: 89%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.value }}
</div>
</div>
<div style="">
<!-- 止 -->
<div
style="
display: inline-block;
width: 10%;
line-height: 50px;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.end.label }}
</div>
<div
style="
display: inline-block;
width: 89%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.end.value }}
</div>
</div>
</div>
</div>
<div
style="
font-size: 36px;
vertical-align: middle;
display: flex;
align-items: center;
font-weight: 500;
height: 76px;
border-top: 2px solid #222;
box-sizing: border-box;
"
>
<!-- 调配员 -->
<div style="width: 50%; display: flex">
<div
style="
width: 42%;
text-align: center;
line-height: 76px;
box-sizing: border-box;
border-right: 2px solid #222;"
>
{{ item.deployment.label }}
</div>
<div
style="
box-sizing: border-box;
padding-left: 20px;
width: 58%;
line-height: 76px;
border-right: 2px solid #222;"
>
{{ item.deployment.value }}
</div>
</div>
<!-- 检验员 -->
<div style="width: 50%; display: flex">
<div
style="width: 40%;
text-align: center;
line-height: 76px;
border-right: 2px solid #222;"
>
{{ item.inspector.label }}
</div>
<div
style="box-sizing: border-box; padding-left: 20px; line-height: 76px;
"
>
{{ item.inspector.value }}
</div>
</div>
</div>
<div
style="
font-size: 36px;
vertical-align: middle;
display: flex;
align-items: center;
font-weight: 500;
height: 76px;
border-top: 2px solid #222;
box-sizing: border-box;
"
>
<div
style="
width: 21%;
text-align: center;
line-height: 76px;
box-sizing: border-box;
border-right: 2px solid #222;"
>
{{ item.remark.label }}
</div>
<div
style="
box-sizing: border-box;
padding-left: 20px;
line-height: 76px;
border-right: 2px solid #222;"
>
{{ item.remark.value }}
</div>
</div>
</div>
<div
style="font-size: 34px;
"
>B330315</div>
</section>
</section>
</template>
<script>
import VueQr from 'vue-qr'
export default {
name: 'Print',
components: {
VueQr
},
props: {
config: {
type: Object,
default: () => {
return {
width: 300,
prints: []
}
}
}
},
data() {
return {
timer: null
}
},
beforeDestroy() {
this.timer = null
},
methods: {
print() {
this.timer = setInterval(() => {
if (this.$refs.print.innerHTML) {
this.printTag()
clearInterval(this.timer)
}
}, 300)
},
printTag() {
var iframe = document.createElement('IFRAME')
var doc = null
iframe.setAttribute(
'style',
'position:absolute; width:0; height:0; margin-top: -1000px; margin-left: -1000px;'
)
document.body.appendChild(iframe)
doc = iframe.contentWindow.document
doc.write(`
<style>
div{
}
</style>
`)
doc.write(this.$refs.print.innerHTML)
doc.close()
iframe.contentWindow.focus()
iframe.contentWindow.print()
}
}
}
</script>
<style lang='scss' scoped>
.print {
position: absolute;
z-index: -999;
left: -1000px;
top: -1110px;
}
</style>
<template>
<section ref="print" class="print">
<section>
<div
v-for="(item, index) in config.prints"
:key="index"
style="
border: 2px solid #222;
box-sizing: border-box;
font-weight: 500;
font-size: 36px;
"
>
<div style="border-bottom: 2px solid #222">
<div
style="
display: inline-block;
border-right: 2px solid #222;
width: 70%;
vertical-align: top;
"
>
<!-- 第一行 -->
<div
style="
height: 90px;
border-bottom: 2px solid #222;
box-sizing: border-box;
line-height: 90px;
"
>
<!-- 标题 -->
<div
style="
display: inline-block;
width: 40%;
text-align: center;
box-sizing: border-box;
border-right: 2px solid #222;
font-size: 40px;
"
>
{{ item.title }}
</div>
<!-- 编号 -->
<div
style="
display: inline-block;
vertical-align: top;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.number.label }}
</div>
<div
style="
display: inline-block;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.number.value }}
</div>
</div>
<!-- 第二行 -->
<div
style="
height: 80px;
display: flex;
align-items: center;
border-bottom: 2px solid #222;
box-sizing: border-box;
"
>
<!-- 材料规范 -->
<div
style="
display: inline-block;
width: 30%;
height: 80px;
line-height: 80px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.standard.label }}
</div>
<div
style="
display: inline-block;
height: 80px;
line-height: 80px;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.standard.value }}
</div>
</div>
<div
style="
height: 80px;
display: flex;
align-items: center;
border-bottom: 2px solid #222;
"
>
<!-- 材料标识/牌号 -->
<div
style="
vertical-align: top;
display: inline-block;
width: 30%;
height: 80px;
line-height: 80px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mark.label }}
</div>
<div
style="
display: inline-block;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.mark.value }}
</div>
</div>
<!-- 合格证号 -->
<div
style="height: 80px; box-sizing: border-box; border-bottom: 2px solid #222 "
>
<div
style="
line-height: 80px;
vertical-align: top;
display: inline-block;
width: 30%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mixingUnit.label }}
</div>
<div
style="
display: inline-block;
width: 30%;
line-height: 80px;
padding-left: 10px;
vertical-align: top;
border-right: 2px solid #222;
box-sizing: border-box;
"
>
{{ item.mixingUnit.value }}
</div>
<!-- 数量 -->
<div
style="
line-height: 80px;
vertical-align: top;
display: inline-block;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.count.label }}
</div>
<div
style="
display: inline-block;
line-height: 80px;
box-sizing: border-box;
padding-left: 20px;
"
>
{{ item.count.value }}
</div>
</div>
<div
style="height: 60px; line-height: 60px;"
>
<!-- 混合开始时间 -->
<div
style="
display: inline-block;
width: 30%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mixStartTime.label }}
</div>
<div
style="
display: inline-block;
width: 70%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.mixStartTime.value }}
</div>
</div>
</div>
<!-- 二维码 -->
<div
style="
display: inline-block;
padding: 38px 50px;
width: 29%;
box-sizing: border-box;
"
>
<vue-qr
style="height:300px;"
:size="config.width"
:margin="0"
:text="item.text"
:qid="index.toString()"
/>
</div>
</div>
<div
v-if="item.remainingConstructionPeriod"
style="height: 40px; border-bottom: 2px solid #222"
>
<!-- 剩余施工期 -->
<div
style="
display: inline-block;
border-right: 2px solid #222;
line-height: 40px;
width: 24%;
text-align: center;
box-sizing: border-box;
"
>
{{ item.remainingConstructionPeriod.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.remainingConstructionPeriod.value }}
</div>
</div>
<!-- 施工期 -->
<div
v-if="!item.remainingConstructionPeriod"
style="height: 120px; box-sizing: border-box"
>
<div
style="
display: inline-block;
width: 21%;
border-right: 2px solid #222;
text-align: center;
line-height: 120px;
box-sizing: border-box;
vertical-align: top;
"
>
{{ item.validity.label }}
</div>
<div
style="
display: inline-block;
width: 79%;
line-height: 60px;
vertical-align: top;
"
>
<div
style="
display: inline-block;
border-bottom: 2px solid #222;
box-sizing: border-box;
width: 100%;"
>
<!-- 始 -->
<div
style="
display: inline-block;
width: 10%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.label }}
</div>
<div
style="
display: inline-block;
width: 89%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.value }}
</div>
</div>
<div style="">
<!-- 止 -->
<div
style="
display: inline-block;
width: 10%;
line-height: 50px;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.end.label }}
</div>
<div
style="
display: inline-block;
width: 89%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.end.value }}
</div>
</div>
</div>
</div>
<!-- 2 -->
<!--解冻及施工期 -->
<div
v-if="item.remainingConstructionPeriod"
style="width: 100%; height: 40px; font-size: 36px;"
>
<div
style="
display: inline-block;
text-align: center;
vertical-align: top;
line-height: 40px;
width: 24%;
border-right: 2px solid #222;
box-sizing: border-box;
"
>
{{ item.validity.label }}
</div>
<div
style="
display: inline-block;
width: 76%;
height: 40px;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.label }}
{{ item.validity.value.start.value }}
{{ item.validity.value.end.label }}
{{ item.validity.value.end.value }}
</div>
</div>
<!-- 4 -->
<!-- -->
<div
style="
font-size: 36px;
vertical-align: middle;
display: flex;
align-items: center;
font-weight: 500;
height: 80px;
border-top: 2px solid #222;
box-sizing: border-box;
"
>
<!-- 调配员 -->
<div style="width: 50%; display: flex">
<div
style="
width: 42%;
text-align: center;
line-height: 80px;
box-sizing: border-box;
border-right: 2px solid #222;"
>
{{ item.deployment.label }}
</div>
<div
style="
box-sizing: border-box;
padding-left: 20px;
width: 58%;
line-height: 80px;
border-right: 2px solid #222;"
>
{{ item.deployment.value }}
</div>
</div>
<!-- 检验员 -->
<div style="width: 50%; display: flex">
<div
style="width: 40%;
text-align: center;
line-height: 80px;
border-right: 2px solid #222;"
>
{{ item.inspector.label }}
</div>
<div
style="box-sizing: border-box; padding-left: 20px; line-height: 80px;
"
>
{{ item.inspector.value }}
</div>
</div>
</div>
</div>
<div
style="font-size: 34px;
"
>B3303166</div>
</section>
</section>
</template>
<script>
import VueQr from 'vue-qr'
export default {
name: 'Print',
components: {
VueQr
},
props: {
config: {
type: Object,
default: () => {
return {
width: 300,
prints: []
}
}
}
},
data() {
return {
timer: null
}
},
beforeDestroy() {
this.timer = null
},
methods: {
print() {
this.timer = setInterval(() => {
if (this.$refs.print.innerHTML) {
this.printTag()
clearInterval(this.timer)
}
}, 300)
},
printTag() {
var iframe = document.createElement('IFRAME')
var doc = null
iframe.setAttribute(
'style',
'position:absolute; width:0; height:0; margin-top: -1000px; margin-left: -1000px;'
)
document.body.appendChild(iframe)
doc = iframe.contentWindow.document
doc.write(`
<style>
div{
}
</style>
`)
doc.write(this.$refs.print.innerHTML)
doc.close()
iframe.contentWindow.focus()
iframe.contentWindow.print()
}
}
}
</script>
<style lang='scss' scoped>
.print {
position: absolute;
z-index: -999;
left: -1000px;
top: -1110px;
}
</style>
......@@ -6,21 +6,21 @@
:key="index"
style="
border: 2px solid #222;
height: 100%;
box-sizing: border-box;
font-weight: lighter;
font-size: 25px;
font-weight: 500;
font-size: 36px;
"
>
<div style="height: 334px; border-bottom: 2px solid #222">
<div style="border-bottom: 2px solid #222">
<div
style="
display: inline-block;
border-right: 2px solid #222;
width: 60%;
width: 70%;
vertical-align: top;
"
>
<!-- 第一行 -->
<div
style="
height: 100px;
......@@ -32,142 +32,189 @@
<div
style="
display: inline-block;
width: 65%;
width: 40%;
text-align: center;
font-size: 30px;
box-sizing: border-box;
border-right: 2px solid #222;
font-size: 40px;
"
>
{{ item.title }}
</div>
<!-- 数量 -->
<!-- 编号 -->
<div
style="
display: inline-block;
width: 34%;
vertical-align: top;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
padding-left: 20px;
"
>
重量 <span style="padding-left: 20px">{{ item.count }}</span>
{{ item.number.label }}
</div>
<div
style="
display: inline-block;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.number.value }}
</div>
</div>
<!-- 第二行 -->
<div
style="
height: 76px;
border-botoom: 2px solid #222;
height: 90px;
display: flex;
align-items: center;
border-bottom: 2px solid #222;
"
>
<!-- 编号 -->
<!-- 材料规范 -->
<div
style="
line-height: 76px;
display: inline-block;
vertical-align: top;
width: 40%;
width: 30%;
height: 90px;
line-height: 90px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.number.label }}
{{ item.standard.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
height: 90px;
line-height: 90px;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
font-size: 36px;
"
>
{{ item.number.value }}
</div>
{{ item.standard.value }}
</div>
</div>
<div
style="
height: 76px;
height: 90px;
display: flex;
align-items: center;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
border-bottom: 2px solid #222;
"
>
<!-- 材料规范 -->
<!-- 材料标识/牌号 -->
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 40%;
width: 30%;
height: 90px;
line-height: 90px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.standard.label }}
{{ item.mark.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
font-size: 36px;
"
>
{{ item.standard.value }}
{{ item.mark.value }}
</div>
</div>
<!-- 合格证号 -->
<div
style="height: 90px; box-sizing: border-box; "
>
<div
style="
height: 76px;
display: flex;
align-items: center;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
line-height: 90px;
vertical-align: top;
display: inline-block;
width: 30%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
<!-- 牌号 -->
{{ item.mixingUnit.label }}
</div>
<div
style="
display: inline-block;
width: 30%;
line-height: 90px;
padding-left: 10px;
vertical-align: top;
border-right: 2px solid #222;
box-sizing: border-box;
"
>
{{ item.mixingUnit.value }}
</div>
<!-- 数量 -->
<div
style="
line-height: 76px;
line-height: 90px;
vertical-align: top;
display: inline-block;
width: 40%;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mark.label }}
{{ item.count.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
line-height: 90px;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
padding-left: 20px;
"
>
{{ item.mark.value }}
{{ item.count.value }}
</div>
</div>
<!-- <div
style="
height: 90px;
display: flex;
align-items: center;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
"
> -->
<!-- 牌号 -->
</div>
<!-- 二维码 -->
<div
style="
display: inline-block;
padding: 50px 5px;
width: 39%;
padding: 38px 50px;
width: 29%;
box-sizing: border-box;
"
>
<vue-qr
style="height:300px;"
:size="config.width"
:margin="0"
:text="item.text"
......@@ -231,62 +278,40 @@
{{ item.ineffectiveTime.value }}
</div>
</div>
<!-- 合格证号 -->
<!-- 施工期 -->
<div
style="height: 80px; box-sizing: border-box; border-bottom: 2px solid #222;"
v-if="!item.remainingConstructionPeriod"
style="height: 120px; box-sizing: border-box"
>
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 24%;
width: 21%;
border-right: 2px solid #222;
text-align: center;
line-height: 120px;
box-sizing: border-box;
"
>
{{ item.mixingUnit.label }}
</div>
<div
style="
display: inline-block;
width: 69%;
line-height: 80px;
padding-left: 10px;
vertical-align: top;
"
>
{{ item.mixingUnit.value }}
</div>
施工期
</div>
<!-- 施工期 -->
<div
v-if="!item.remainingConstructionPeriod"
style="height: 80px; box-sizing: border-box"
>
<div
style="
display: inline-block;
width: 24%;
border-right: 2px solid #222;
text-align: center;
line-height: 80px;
box-sizing: border-box;
width: 79%;
line-height: 60px;
vertical-align: top;
"
>
施工期
</div>
<div
style="
display: inline-block;
width: 69%;
line-height: 40px;
vertical-align: top;
"
border-bottom: 2px solid #222;
box-sizing: border-box;
width: 100%;"
>
<div style="">
<!-- 始 -->
<div
style="
......@@ -316,6 +341,7 @@
style="
display: inline-block;
width: 10%;
line-height: 50px;
box-sizing: border-box;
padding-left: 10px;
"
......@@ -339,7 +365,7 @@
<!--解冻及施工期 -->
<div
v-if="item.remainingConstructionPeriod"
style="width: 100%; height: 40px"
style="width: 100%; height: 40px; font-size: 36px;"
>
<div
style="
......@@ -358,7 +384,7 @@
style="
display: inline-block;
width: 76%;
font-size: 25px;
height: 40px;
box-sizing: border-box;
padding-left: 10px;
......@@ -375,37 +401,63 @@
<!-- -->
<div
style="
font-size: 25px;
font-size: 36px;
vertical-align: middle;
display: block;
display: flex;
align-items: center;
font-weight: lighter;
font-weight: 500;
height: 90px;
border-top: 2px solid #222;
border-bottom: 2px solid #222
box-sizing: border-box;
"
>
<!-- 调配员 -->
<div style="width: 50%; display: flex">
<div style="width: 40.2%; text-align: center">
<div
style="
width: 42%;
text-align: center;
line-height: 90px;
box-sizing: border-box;
border-right: 2px solid #222;"
>
{{ item.deployment.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
<div
style="
box-sizing: border-box;
padding-left: 20px;
width: 58%;
line-height: 90px;
border-right: 2px solid #222;"
>
{{ item.deployment.value }}
</div>
</div>
<!-- 检验员 -->
<div style="width: 50%; display: flex">
<div style="width: 40%; text-align: center">
<div
style="width: 40%;
text-align: center;
line-height: 90px;
border-right: 2px solid #222;"
>
{{ item.inspector.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
<div
style="box-sizing: border-box; padding-left: 20px; line-height: 90px;
"
>
{{ item.inspector.value }}
</div>
</div>
</div>
<div>B330319B</div>
</div>
<div
style="font-size: 34px;
"
>B330319B</div>
</section>
</section>
</template>
......@@ -421,7 +473,7 @@ export default {
type: Object,
default: () => {
return {
width: 150,
width: 300,
prints: []
}
}
......
......@@ -6,101 +6,118 @@
:key="index"
style="
border: 2px solid #222;
height: 100%;
box-sizing: border-box;
font-weight: lighter;
font-size: 25px;
font-weight: 500;
font-size: 36px;
"
>
<div style="height: 334px; border-bottom: 2px solid #222">
<div style="border-bottom: 2px solid #222">
<div
style="
display: inline-block;
border-right: 2px solid #222;
width: 60%;
width: 75%;
vertical-align: top;
"
>
<!-- 第一行 -->
<div
style="
height: 100px;
height: 90px;
border-bottom: 2px solid #222;
line-height: 100px;
line-height: 90px;
"
>
<!-- 标题 -->
<div
style="
display: inline-block;
width: 65%;
width: 40%;
text-align: center;
font-size: 30px;
box-sizing: border-box;
border-right: 2px solid #222;
font-size: 40px;
"
>
{{ item.title }}
</div>
<!-- 数量 -->
<!-- 编号 -->
<div
style="
display: inline-block;
width: 34%;
vertical-align: top;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
padding-left: 20px;
"
>
重量 <span style="padding-left: 20px">{{ item.weight }}</span>
{{ item.number.label }}
</div>
<div
style="
display: inline-block;
box-sizing: border-box;
padding-left: 10px;
font-size: 36px;
"
>
{{ item.number.value }}
</div>
</div>
<!-- 第二行 -->
<div
style="
height: 76px;
border-botoom: 2px solid #222;
height: 60px;
display: flex;
align-items: center;
border-bottom: 2px solid #222;
"
>
<!-- 编号 -->
<!-- 材料规范 -->
<div
style="
line-height: 76px;
display: inline-block;
vertical-align: top;
width: 40%;
width: 28%;
height: 60px;
line-height: 60px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.number.label }}
{{ item.standard.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
height: 60px;
line-height: 60px;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
font-size: 36px;
"
>
{{ item.number.value }}
{{ item.standard.value }}
</div>
</div>
<div
style="
height: 76px;
height: 60px;
display: flex;
align-items: center;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
border-bottom: 2px solid #222;
"
>
<!-- 牌号 -->
<!-- 材料标识/牌号 -->
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 40%;
width: 28%;
height: 60px;
line-height: 60px;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
......@@ -111,31 +128,24 @@
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
font-size: 36px;
"
>
{{ item.mark.value }}
</div>
</div>
<!-- 合格证号 -->
<div
style="
height: 76px;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
display: flex;
align-items: center;
"
style="height: 60px; box-sizing: border-box; "
>
<!-- 合格证号 -->
<div
style="
line-height: 60px;
vertical-align: top;
display: inline-block;
line-height: 76px;
width: 40%;
width: 28%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
......@@ -146,71 +156,70 @@
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
width: 30%;
line-height: 60px;
padding-left: 10px;
font-size: 25px;
vertical-align: top;
border-right: 2px solid #222;
box-sizing: border-box;
"
>
{{ item.mixingUnit.value }}
</div>
</div>
</div>
<!-- 二维码 -->
<!-- 数量 -->
<div
style="
line-height: 60px;
vertical-align: top;
display: inline-block;
padding: 50px 5px;
width: 39%;
width: 14%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
<vue-qr
:size="config.width"
:margin="0"
:text="item.text"
:qid="index.toString()"
/>
</div>
重量
</div>
<div
style="height: 40px; border-bottom: 2px solid #222"
>
<!-- 材料规范 -->
<div
style="
display: inline-block;
border-right: 2px solid #222;
line-height: 40px;
width: 24%;
text-align: center;
line-height: 60px;
box-sizing: border-box;
padding-left: 20px;
"
>
{{ item.standard.label }}
{{ item.weight }}
</div>
</div>
</div>
<!-- 二维码 -->
<div
style="
display: inline-block;
width: 59%;
padding: 20px 50px;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.standard.value }}
<vue-qr
style="height:236px;"
:size="config.width"
:margin="0"
:text="item.text"
:qid="index.toString()"
/>
</div>
</div>
<div
v-if="item.remainingConstructionPeriod"
style="height: 40px; border-bottom: 2px solid #222"
style="height: 60px; border-bottom: 2px solid #222"
>
<!-- 剩余施工期 -->
<div
style="
display: inline-block;
border-right: 2px solid #222;
line-height: 40px;
width: 24%;
line-height: 60px;
width: 21%;
text-align: center;
box-sizing: border-box;
"
......@@ -225,19 +234,19 @@
padding-left: 10px;
"
>
{{ item.remainingConstructionPeriod.value }}
{{ item.remainingConstructionPeriod.value }}{{ item.remainingConstructionPeriod.value&&'min' }}
</div>
</div>
<div
v-if="item.ineffectiveTime"
style="height: 40px; line-height: 40px; border-bottom: 2px solid #222"
style="height: 60px; line-height: 60px; border-bottom: 2px solid #222"
>
<!-- 失效时间 -->
<div
style="
display: inline-block;
width: 24%;
width: 21%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
......@@ -260,15 +269,15 @@
<!-- 施工期 -->
<div
v-if="!item.remainingConstructionPeriod"
style="height: 80px; box-sizing: border-box"
style="height: 120px; box-sizing: border-box"
>
<div
style="
display: inline-block;
width: 24%;
width: 21%;
border-right: 2px solid #222;
text-align: center;
line-height: 80px;
line-height: 120px;
box-sizing: border-box;
vertical-align: top;
"
......@@ -278,12 +287,18 @@
<div
style="
display: inline-block;
width: 69%;
line-height: 40px;
width: 79%;
line-height: 60px;
vertical-align: top;
"
>
<div style="">
<div
style="
display: inline-block;
border-bottom: 2px solid #222;
box-sizing: border-box;
width: 100%;"
>
<!-- 始 -->
<div
style="
......@@ -313,6 +328,7 @@
style="
display: inline-block;
width: 10%;
line-height: 50px;
box-sizing: border-box;
padding-left: 10px;
"
......@@ -336,15 +352,14 @@
<!--解冻及施工期 -->
<div
v-if="item.remainingConstructionPeriod"
style="width: 100%; height: 40px"
style="width: 100%; height: 120px; line-height:120px; font-size: 36px;"
>
<div
style="
display: inline-block;
text-align: center;
vertical-align: top;
line-height: 40px;
width: 24%;
width: 21%;
border-right: 2px solid #222;
box-sizing: border-box;
"
......@@ -354,54 +369,129 @@
<div
style="
display: inline-block;
width: 76%;
font-size: 25px;
height: 40px;
width: 79%;
line-height: 60px;
vertical-align: top;
"
>
<div
style="
display: inline-block;
border-bottom: 2px solid #222;
box-sizing: border-box;
width: 100%;"
>
<!-- 始 -->
<div
style="
display: inline-block;
width: 10%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.label }}
</div>
<div
style="
display: inline-block;
width: 89%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.start.value }}
</div>
</div>
<div style="">
<!-- 止 -->
<div
style="
display: inline-block;
width: 10%;
line-height: 50px;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.end.label }}
</div>
<div
style="
display: inline-block;
width: 89%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.validity.value.end.value }}
</div>
</div>
</div>
</div>
<!-- 4 -->
<!-- -->
<div
style="
font-size: 25px;
font-size: 36px;
vertical-align: middle;
display: flex;
align-items: center;
font-weight: lighter;
font-weight: 500;
height: 60px;
border-top: 2px solid #222;
border-bottom: 2px solid #222
box-sizing: border-box;
"
>
<!-- 调配员 -->
<div style="width: 50%; display: flex">
<div style="width: 40.2%; text-align: center">
<div
style="
width: 42%;
text-align: center;
line-height: 60px;
box-sizing: border-box;
border-right: 2px solid #222;"
>
{{ item.deployment.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
<div
style="
box-sizing: border-box;
padding-left: 20px;
width: 58%;
line-height: 60px;
border-right: 2px solid #222;"
>
{{ item.deployment.value }}
</div>
</div>
<!-- 检验员 -->
<div style="width: 50%; display: flex">
<div style="width: 40%; text-align: center">
<div
style="width: 40%;
text-align: center;
line-height: 60px;
border-right: 2px solid #222;"
>
{{ item.inspector.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
<div
style="box-sizing: border-box; padding-left: 20px; line-height: 60px;
"
>
{{ item.inspector.value }}
</div>
</div>
</div>
<div>B330320</div>
</div>
<div
style="font-size: 34px;
"
>B330320</div>
</section>
</section>
</template>
......@@ -417,7 +507,7 @@ export default {
type: Object,
default: () => {
return {
width: 150,
width: 300,
prints: []
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment