<template>
|
<j-modal
|
title="铭牌"
|
:width="750"
|
:visible="visible"
|
@cancel="handleCancel"
|
:maskClosable="false"
|
>
|
|
<div id="nameplateTable">
|
<table border="1" cellpadding="12" cellspacing="0" align="center" width="80%" v-for="item in printedRows"
|
:key="item.id">
|
<thead>
|
<tr>
|
<th colspan="3">设备管理牌</th>
|
</tr>
|
</thead>
|
|
<tbody>
|
<tr>
|
<td rowspan="3" align="center">
|
<div style="height: 80%;width: 50%">
|
<QrcodeVue :value="httpUrl+item.id" :size="50"/>
|
</div>
|
</td>
|
<td>设备编号</td>
|
<td>{{ item.equipmentCode }}</td>
|
</tr>
|
|
<tr>
|
<td>设备名称</td>
|
<td>{{ item.equipmentName }}</td>
|
</tr>
|
|
<tr>
|
<td>设备型号</td>
|
<td>{{ item.equipmentModel }}</td>
|
</tr>
|
|
<tr>
|
<td>设备管理</td>
|
<td>使用车间</td>
|
<td>{{ item.orgId_dictText }}</td>
|
</tr>
|
|
<tr>
|
<td rowspan="3" align="center">
|
<div style="height: 80%;width: 50%">
|
<QrcodeVue :value="item.equipmentCode" :size="50"/>
|
</div>
|
</td>
|
<td>出厂编号</td>
|
<td>{{ item.factoryNumber }}</td>
|
</tr>
|
|
<tr>
|
<td>设备管理员</td>
|
<td>{{ item.equipmentManager_dictText }}</td>
|
</tr>
|
|
<tr>
|
<td>安装位置</td>
|
<td>{{ item.installationPosition }}</td>
|
</tr>
|
|
<tr>
|
<td>MES</td>
|
<td colspan="2" style="color: #f00;font-weight: bold;letter-spacing: 1px">非管理员勿动此铭牌</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
|
<template slot="footer">
|
<a-button @click="handleCancel">关闭</a-button>
|
<a-button type="primary" v-print="'#nameplateTable'">打印</a-button>
|
</template>
|
</j-modal>
|
</template>
|
|
<script>
|
import QrcodeVue from 'qrcode.vue'
|
|
export default {
|
name: 'NameplateModal',
|
components: { QrcodeVue },
|
props: {
|
printedRows: {
|
type: Array
|
}
|
},
|
data() {
|
return {
|
title: '铭牌',
|
visible: false,
|
httpUrl: ''
|
}
|
},
|
methods: {
|
handleCancel() {
|
this.visible = false
|
}
|
}
|
}
|
</script>
|
|
<style lang="less" scoped>
|
/deep/ .ant-modal {
|
height: 75%;
|
overflow: hidden;
|
|
.ant-modal-content {
|
height: 100%;
|
display: flex;
|
flex-direction: column;
|
overflow: hidden;
|
|
::-webkit-scrollbar {
|
width: 8px;
|
height: 8px;
|
}
|
|
.ant-modal-body {
|
flex: 1;
|
overflow: auto;
|
}
|
}
|
}
|
|
table {
|
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
|
color: #000;
|
text-align: center;
|
|
&:not(:last-child) {
|
margin-bottom: 10px;
|
}
|
|
th {
|
font-size: 24px;
|
letter-spacing: 3px;
|
padding: 12px;
|
}
|
|
td {
|
font-size: 14px;
|
width: 33%;
|
padding: 6px;
|
}
|
}
|
</style>
|
