Skip to content

T
TF-MOM-WEB
Commit e8e47e45 authored by “lixuyan”'s avatar “lixuyan”
Browse files
Options

打印联调

parent d8e62c14
Hide whitespace changes
Inline Side-by-side
Showing with 1211 additions and 5 deletions
applications/dee-mes/src/privateComponents/components/AssignCradInfo/index.vue
View file @ e8e47e45
<template>
<div class="AssignCradInfo">
<div class="dee-form2 header">
<div class="form-row-title">详情</div>
<div v-show="basicData.appState==='deployed'" class="print-button" @click="print">
<img src="/icons/c-print.png" alt="">
<span>打印</span>
</div>
</div>
<dee-as-com
ref="detailCom"
dis-business
:lay-config="cmpOptions"
:basic-data="basicData"
/>
<PrintTag ref="print" :config="printConfig" />
</div>
</template>
<script>
import PrintTag from './printTag'
import { post } from '@/utils/http'
export default {
name: 'AssignCradInfo',
componentName: '调配卡详情',
components: {},
components: {
PrintTag
},
props: {
basicData: {
type: Object,
......@@ -21,7 +33,13 @@ export default {
},
data() {
return {
cmpOptions: {}
cmpOptions: {},
printConfig: {
visible: false,
width: 260,
prints: []
},
loading: false
}
},
watch: {
......@@ -47,8 +65,178 @@ export default {
}
}
}
},
methods: {
// 打印
print() {
this.loading = true
const params = {
'pageFrom': 1,
'pageSize': 1,
'searchItems': {
'items': [
{
'fieldName': 'id',
'operator': 'EQ',
'value': this.basicData.id
}
],
'operator': 'AND'
},
'openProps': [
{
'name': 'material'
},
{
'name': 'assignCardDetails'
}
],
'sortItem': [
{
'fieldName': 'modifyTime',
'sortOrder': 'desc'
}
]
}
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') {
const a = data.validityStart && data.validityStart.split(':') || []
a.pop()
this.printConfig.prints = [
{
text: data.cardNo,
title: '漆料合格标签',
count: data.actualWeight,
number: { label: '编号', value: data.cardNo },
mark: { label: '油漆牌号', value: data.material.modelNo },
mixingUnit: { label: '调配单位', value: data.assignUnit },
validity: {
label: '有效期',
value: {
start: {
label: '始',
value: a.join(':')
},
end: {
label: '止',
value: b.join(':')
}
}
},
deployment: { label: '调配员', value: data.creator.userName },
inspector: {
label: '检验员',
value: data.checker
}
}
]
} else if (data.subTypeName === 'AssignCardAlodine') {
const c = (data.assignTime && data.assignTime.split(':')) || []
c.pop()
this.printConfig.prints = [
{
text: data.cardNo,
title: '阿洛丁刷涂合格标签',
count: data.assignTotalAmount,
number: { label: '编号', value: data.cardNo },
mark: {
label: '阿洛丁牌号',
value: data.material.modelNo
},
mixingUnit: { label: '调配单位', value: data.assignUnit },
validity: {
label: '有效期',
value: {
start: {
label: '始',
value: c.join(':')
},
end: {
label: '止',
value: b.join(':')
}
}
},
deployment: { label: '调配员', value: data.creator.userName },
inspector: {
label: '检验员',
value: data.checker
}
}
]
} else if (data.subTypeName === 'AssignCardLacquer') {
const d = (data.mixStartTime && data.mixStartTime.split(':')) || []
d.pop()
const e = (data.mixEndTime && data.mixEndTime.split(':')) || []
e.pop()
this.printConfig.prints = [
{
text: data.cardNo,
title: '胶料合格标签',
count: data.actualWeight,
number: { label: '编号', value: data.cardNo },
mark: { label: '牌号', value: data.material.modelNo },
mixingUnit: {
label: '合格证号',
value: data.certificateNo
},
validity: {
label: '解冻及施工期',
value: {
start: {
label: '始',
value: d.join(':')
},
end: {
label: '止',
value: e.join(':')
}
}
},
deployment: { label: '调配员', value: data.creator.userName },
inspector: {
label: '检验员',
value: data.checker
}
}
]
}
this.$refs.print.print()
})
.catch((err) => console.log(err))
.finally(() => {
this.loading = false
})
}
}
}
</script>
<style lang='scss'>
.AssignCradInfo{
.header{
display: flex;
justify-content: space-between;
align-content: center;
.form-row-title{
padding-left: 0px;
}
.print-button{
cursor: pointer;
display: flex;
align-items: center;
img{
width: 16px;
height: 16px;
}
}
}
}
</style>
applications/dee-mes/src/privateComponents/components/AssignCradInfo/printTag.vue 0 → 100644
View file @ e8e47e45
<template>
<section ref="print" class="print">
<section class="prinaa">
<div
v-for="(item, index) in config.prints"
:key="index"
style="
border: 2px solid #222;
height: 100%;
box-sizing: border-box;
font-weight: lighter;
font-size: 25px;
"
>
<div style="height: 334px; border-bottom: 2px solid #222">
<div
style="
display: inline-block;
border-right: 2px solid #222;
width: 60%;
vertical-align: top;
"
>
<div
style="
height: 100px;
border-bottom: 2px solid #222;
line-height: 100px;
"
>
<!-- 标题 -->
<div
style="
display: inline-block;
width: 65%;
text-align: center;
font-size: 30px;
"
>
{{ item.title }}
</div>
<!-- 数量 -->
<div
style="
display: inline-block;
width: 34%;
box-sizing: border-box;
padding-left: 20px;
"
>
数量 <span style="padding-left: 20px">{{ item.count }}</span>
</div>
</div>
<div
style="
height: 76px;
border-botoom: 2px solid #222;
display: flex;
align-items: center;
"
>
<!-- 编号 -->
<div
style="
line-height: 76px;
display: inline-block;
vertical-align: top;
width: 40%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.number.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
"
>
{{ item.number.value }}
</div>
</div>
<div
style="
height: 76px;
display: flex;
align-items: center;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
"
>
<!-- 牌号 -->
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 40%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mark.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
"
>
{{ item.mark.value }}
</div>
</div>
<div
style="
height: 76px;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
display: flex;
align-items: center;
"
>
<!-- 合格证号 -->
<div
style="
display: inline-block;
line-height: 76px;
width: 40%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mixingUnit.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
"
>
{{ item.mixingUnit.value }}
</div>
</div>
</div>
<!-- 二维码 -->
<div
style="
display: inline-block;
padding: 50px 5px;
width: 39%;
box-sizing: border-box;
"
>
<vue-qr
: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.ineffectiveTime"
style="height: 40px; line-height: 40px; border-bottom: 2px solid #222"
>
<!-- 失效时间 -->
<div
style="
display: inline-block;
width: 24%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.ineffectiveTime.label }}
</div>
<div
style="
display: inline-block;
width: 76%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.ineffectiveTime.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;
vertical-align: top;
"
>
施工期
</div>
<div
style="
display: inline-block;
width: 69%;
line-height: 40px;
vertical-align: top;
"
>
<div style="">
<!-- 始 -->
<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%;
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"
>
<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%;
font-size: 25px;
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: 25px;
vertical-align: middle;
display: block;
display: flex;
align-items: center;
font-weight: lighter;
border-top: 2px solid #222;
"
>
<!-- 调配员 -->
<div style="width: 50%; display: flex">
<div style="width: 40.2%; text-align: center">
{{ item.deployment.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
{{ item.deployment.value }}
</div>
</div>
<!-- 检验员 -->
<div style="width: 50%; display: flex">
<div style="width: 40%; text-align: center">
{{ item.inspector.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
{{ item.inspector.value }}
</div>
</div>
</div>
</div>
</section>
</section>
</template>
<script>
import VueQr from 'vue-qr'
export default {
name: 'Print',
components: {
VueQr
},
props: {
config: {
type: Object,
default: () => {
return {
width: 150,
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>
applications/dee-mes/src/privateComponents/components/LacquerFreeze/index.vue
View file @ e8e47e45
......@@ -63,10 +63,12 @@
<div class="table">
<!-- 表格 -->
<dee-table
selection-row
:index-row="indexRow"
:columns="colums2"
:data="tableData2"
:options="tableOptions2"
@selection-change="selectionChange"
>
<dee-tools slot="header" :tools="tools" mode="normal" />
</dee-table>
......@@ -78,9 +80,11 @@
:card-id="basicData.id"
@reload="reload"
/>
<PrintTag ref="print" :config="printConfig" />
</div>
</template>
<script>
import PrintTag from './printTag'
import config from './config'
import Dialog from './dialog'
import { post } from '@/utils/http'
......@@ -88,7 +92,8 @@ export default {
name: 'LacquerFreeze',
componentName: '流程中冷冻',
components: {
Dialog
Dialog,
PrintTag
},
mixins: [config],
props: {
......@@ -120,6 +125,18 @@ export default {
this.$refs.dialog.open()
}
}
}, {
name: '打印',
icon: '/icons/c-print.png',
handler: {
click: (e) => {
if (this.sectionData.length !== 1) {
this.$message.error('请选择一条数据')
} else {
this.print()
}
}
}
}],
colums2: [
{
......@@ -215,21 +232,128 @@ export default {
stripe: true,
border: true,
height: '29vh'
},
sectionData: [],
printConfig: {
visible: false,
width: 260,
prints: []
}
}
},
watch: {
basicData: {
form: {
immediate: true,
deep: true,
handler: function(val) {
if (val.assignCardItems && val.assignCardItems.length > 0) {
this.tableData2 = this.basicData.assignCardItems
this.tableData2 = this.form.assignCardItems
}
}
}
},
methods: {
selectionChange(section) {
this.sectionData = section
},
print() {
this.loading = true
const params = {
'pageFrom': 1,
'pageSize': 1,
'searchItems': {
'items': [
{
'fieldName': 'id',
'operator': 'EQ',
'value': this.sectionData[0].id
}
],
'operator': 'AND'
},
'openProps': [
{
'name': 'assignCard',
'openProps': [
{
'name': 'material'
}
]
}
],
'sortItem': [
{
'fieldName': 'modifyTime',
'sortOrder': 'desc'
}
]
}
post('/AssignCardItem/detail', params)
.then((res) => {
var data = res.items.content[0]
this.printConfig = Object.assign({}, this.printConfig, {
visible: true
})
var b =
(data.assignCard.validityEnd &&
data.assignCard.validityEnd.split(':')) ||
[]
b.pop()
var c = (data.thawPickTime && data.thawPickTime.split(':')) || []
c.pop()
var d = (data.activeTime && data.activeTime.split(':')) || []
d.pop()
this.printConfig.prints = [
{
text: data.assignCard.cardNo,
title: '胶料冷冻标签',
count: data.weight,
number: { label: '编号', value: data.itemNo },
mark: {
label: '牌号',
value: data.assignCard.material.modelNo
},
mixingUnit: {
label: '合格证号',
value: data.assignCard.certificateNo
},
remainingConstructionPeriod: {
label: '剩余施工期',
value: data.assignCard.leftWorkMinutes
},
ineffectiveTime: {
label: '失效时间',
value: b.join(':')
},
validity: {
label: '解冻及施工期',
value: {
start: {
label: '始',
value: c.join(':')
},
end: {
label: '止',
value: d.join(':')
}
}
},
deployment: { label: '调配员', value: data.creator.userName },
inspector: {
label: '检验员',
value: data.assignCard.checker
}
}
]
this.$refs.print.print()
})
.catch((err) => console.log(err))
.finally(() => {
this.loading = false
})
},
reload() {
this.getLasousInstallation()
},
......
applications/dee-mes/src/privateComponents/components/LacquerFreeze/printTag.vue 0 → 100644
View file @ e8e47e45
<template>
<section ref="print" class="print">
<section class="prinaa">
<div
v-for="(item, index) in config.prints"
:key="index"
style="
border: 2px solid #222;
height: 100%;
box-sizing: border-box;
font-weight: lighter;
font-size: 25px;
"
>
<div style="height: 334px; border-bottom: 2px solid #222">
<div
style="
display: inline-block;
border-right: 2px solid #222;
width: 60%;
vertical-align: top;
"
>
<div
style="
height: 100px;
border-bottom: 2px solid #222;
line-height: 100px;
"
>
<!-- 标题 -->
<div
style="
display: inline-block;
width: 65%;
text-align: center;
font-size: 30px;
"
>
{{ item.title }}
</div>
<!-- 数量 -->
<div
style="
display: inline-block;
width: 34%;
box-sizing: border-box;
padding-left: 20px;
"
>
数量 <span style="padding-left: 20px">{{ item.count }}</span>
</div>
</div>
<div
style="
height: 76px;
border-botoom: 2px solid #222;
display: flex;
align-items: center;
"
>
<!-- 编号 -->
<div
style="
line-height: 76px;
display: inline-block;
vertical-align: top;
width: 40%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.number.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
"
>
{{ item.number.value }}
</div>
</div>
<div
style="
height: 76px;
display: flex;
align-items: center;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
"
>
<!-- 牌号 -->
<div
style="
line-height: 76px;
vertical-align: top;
display: inline-block;
width: 40%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mark.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
"
>
{{ item.mark.value }}
</div>
</div>
<div
style="
height: 76px;
border-top: 2px solid #222;
border-botoom: 2px solid #222;
display: flex;
align-items: center;
"
>
<!-- 合格证号 -->
<div
style="
display: inline-block;
line-height: 76px;
width: 40%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.mixingUnit.label }}
</div>
<div
style="
display: inline-block;
width: 59%;
box-sizing: border-box;
padding-left: 10px;
font-size: 25px;
"
>
{{ item.mixingUnit.value }}
</div>
</div>
</div>
<!-- 二维码 -->
<div
style="
display: inline-block;
padding: 50px 5px;
width: 39%;
box-sizing: border-box;
"
>
<vue-qr
: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.ineffectiveTime"
style="height: 40px; line-height: 40px; border-bottom: 2px solid #222"
>
<!-- 失效时间 -->
<div
style="
display: inline-block;
width: 24%;
border-right: 2px solid #222;
text-align: center;
box-sizing: border-box;
"
>
{{ item.ineffectiveTime.label }}
</div>
<div
style="
display: inline-block;
width: 76%;
box-sizing: border-box;
padding-left: 10px;
"
>
{{ item.ineffectiveTime.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;
vertical-align: top;
"
>
施工期
</div>
<div
style="
display: inline-block;
width: 69%;
line-height: 40px;
vertical-align: top;
"
>
<div style="">
<!-- 始 -->
<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%;
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"
>
<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%;
font-size: 25px;
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: 25px;
vertical-align: middle;
display: block;
display: flex;
align-items: center;
font-weight: lighter;
border-top: 2px solid #222;
"
>
<!-- 调配员 -->
<div style="width: 50%; display: flex">
<div style="width: 40.2%; text-align: center">
{{ item.deployment.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
{{ item.deployment.value }}
</div>
</div>
<!-- 检验员 -->
<div style="width: 50%; display: flex">
<div style="width: 40%; text-align: center">
{{ item.inspector.label }}
</div>
<div style="box-sizing: border-box; padding-left: 20px">
{{ item.inspector.value }}
</div>
</div>
</div>
</div>
</section>
</section>
</template>
<script>
import VueQr from 'vue-qr'
export default {
name: 'Print',
components: {
VueQr
},
props: {
config: {
type: Object,
default: () => {
return {
width: 150,
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>
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