|
|
|
<!DOCTYPE html>
|
|
|
|
<html lang="en">
|
|
|
|
|
|
|
|
<head>
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<title>回收台账</title>
|
|
|
|
<style>
|
|
|
|
body {
|
|
|
|
padding: 0;
|
|
|
|
margin: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.max_box {
|
|
|
|
width: 756px;
|
|
|
|
/* height: 1086px; */
|
|
|
|
margin: auto;
|
|
|
|
}
|
|
|
|
.max_box>div:nth-of-type(1) {
|
|
|
|
width: 100%;
|
|
|
|
text-align: center;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
}
|
|
|
|
.max_box>div:nth-of-type(2) {
|
|
|
|
width: 100%;
|
|
|
|
text-align: center;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.telbox {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
border: 2px solid #000000;
|
|
|
|
margin-top: 10px;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.ghdanwei{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
|
|
}
|
|
|
|
.ghdanwei>div{
|
|
|
|
border-bottom: 2px solid #000000;
|
|
|
|
/* line-height: 35px; */
|
|
|
|
height: 35px;
|
|
|
|
box-sizing: border-box;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
}
|
|
|
|
.ghdanwei>div:nth-of-type(1){
|
|
|
|
width: 100px;
|
|
|
|
border-right: 2px solid #000000;
|
|
|
|
/* padding-left: 10px; */
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.ghdanwei>div:nth-of-type(2){
|
|
|
|
flex: 1;
|
|
|
|
}
|
|
|
|
.wuzlb{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
font-weight: 600;
|
|
|
|
}
|
|
|
|
.wuzlb>div:nth-of-type(1){
|
|
|
|
width: 80%;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
border-right: 2px solid #000000;
|
|
|
|
border-bottom: 2px solid #000000;
|
|
|
|
box-sizing: border-box;
|
|
|
|
line-height: 35px;
|
|
|
|
height: 35px;
|
|
|
|
}
|
|
|
|
.wuzlb>div:nth-of-type(1)>div:nth-of-type(1){
|
|
|
|
width: 100px;
|
|
|
|
border-right: 2px solid #000000;
|
|
|
|
box-sizing: border-box;
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.wuzlb>div:nth-of-type(1)>div:nth-of-type(2){
|
|
|
|
flex: 1;
|
|
|
|
}
|
|
|
|
.wuzlb>div:nth-of-type(2){
|
|
|
|
width: 20%;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
border-bottom: 2px solid #000000;
|
|
|
|
box-sizing: border-box;
|
|
|
|
line-height: 35px;
|
|
|
|
height: 35px;
|
|
|
|
}
|
|
|
|
.wuzlb>div:nth-of-type(2)>div:nth-of-type(1){
|
|
|
|
width: 50px;
|
|
|
|
border-right: 2px solid #000000;
|
|
|
|
box-sizing: border-box;
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.wuzlb>div:nth-of-type(2)>div:nth-of-type(2){
|
|
|
|
flex: 1;
|
|
|
|
}
|
|
|
|
.tianxienr{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
padding-left: 260px;
|
|
|
|
}
|
|
|
|
.tianxienr>div:nth-of-type(1){
|
|
|
|
width:60px;
|
|
|
|
border-right: 2px solid #000000;
|
|
|
|
border-left: 2px solid #000000;
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.huafenzj{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
font-weight: 600;
|
|
|
|
}
|
|
|
|
.huafenzj>div{
|
|
|
|
width: 50%;
|
|
|
|
line-height: 35px;
|
|
|
|
height: 35px;
|
|
|
|
padding-left: 10px;
|
|
|
|
box-sizing: border-box;
|
|
|
|
border-right: 2px solid #000000;
|
|
|
|
border-bottom: 2px solid #000000;
|
|
|
|
}
|
|
|
|
.huafenzj>div:nth-of-type(2){
|
|
|
|
border-right: none;
|
|
|
|
}
|
|
|
|
.neironqu{
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
padding: 2px 4px;
|
|
|
|
border-bottom: 2px solid #000000;
|
|
|
|
}
|
|
|
|
.neironqu:nth-last-child(1){
|
|
|
|
border-bottom: none;
|
|
|
|
}
|
|
|
|
.neironqu>div:nth-of-type(1){
|
|
|
|
font-weight: 600;
|
|
|
|
}
|
|
|
|
.neironqu>div:nth-of-type(2){
|
|
|
|
margin-top: 20px;
|
|
|
|
margin-bottom: 20px;
|
|
|
|
}
|
|
|
|
.neironqu>div:nth-of-type(3){
|
|
|
|
font-weight: 600;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: space-between;
|
|
|
|
margin-top: 20px;
|
|
|
|
}
|
|
|
|
.suom{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
.suom>div:nth-of-type(1){
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
top: 0;
|
|
|
|
}
|
|
|
|
.imags {
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
|
|
|
.imags img {
|
|
|
|
width: 70px;
|
|
|
|
height: 50px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.img1 {
|
|
|
|
position: absolute;
|
|
|
|
top: 310px;
|
|
|
|
left: 110px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.img2 {
|
|
|
|
position: absolute;
|
|
|
|
top:410px ;
|
|
|
|
left: 110px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.img3 {
|
|
|
|
position: absolute;
|
|
|
|
top: 510px;
|
|
|
|
left: 110px;
|
|
|
|
}
|
|
|
|
.img4 {
|
|
|
|
position: absolute;
|
|
|
|
top: 610px;
|
|
|
|
left: 110px;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
<style>
|
|
|
|
.dayinann{
|
|
|
|
width: 100px;
|
|
|
|
height: 40px;
|
|
|
|
background-color: #0ea5fd;
|
|
|
|
color: #ffffff;
|
|
|
|
border-radius: 5px;
|
|
|
|
border: none;
|
|
|
|
outline: none;
|
|
|
|
margin-top: 50px;
|
|
|
|
position: relative;
|
|
|
|
left: 50%;
|
|
|
|
transform: translate(-50%);
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
</head>
|
|
|
|
|
|
|
|
<body>
|
|
|
|
<!--startprint-->
|
|
|
|
<div class="max_box">
|
|
|
|
<div>新疆分公司</div>
|
|
|
|
<div>委托采购物质入库验收报告</div>
|
|
|
|
<div id="tbdw">
|
|
|
|
填报单位:
|
|
|
|
</div>
|
|
|
|
<div class="imags">
|
|
|
|
<img class="img1" src="./1.png" />
|
|
|
|
<img class="img2" src="./2.png" />
|
|
|
|
<img class="img3" src="./3.png" />
|
|
|
|
<img class="img4" src="./4.png" />
|
|
|
|
</div>
|
|
|
|
<div class="telbox">
|
|
|
|
<div class="ghdanwei">
|
|
|
|
<div>供货单位</div>
|
|
|
|
<div id ="ghdw"></div>
|
|
|
|
</div>
|
|
|
|
<div class="wuzlb">
|
|
|
|
<div>
|
|
|
|
<div >物资名称</div>
|
|
|
|
<div id="wzmc"></div>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div >类别</div>
|
|
|
|
<div id="lb"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="wuzlb">
|
|
|
|
<div>
|
|
|
|
<div>合同号</div>
|
|
|
|
<div class="tianxienr">
|
|
|
|
<div >项数</div>
|
|
|
|
<div id="xs"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div >类别</div>
|
|
|
|
<div id="lb1"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="huafenzj">
|
|
|
|
<div id ="dhsj">
|
|
|
|
到货时间:
|
|
|
|
</div>
|
|
|
|
<div id ="yssj">
|
|
|
|
验收时间:
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="ghdanwei">
|
|
|
|
<div style="height: 50px;" >验收总金额(不含税)</div>
|
|
|
|
<div style="height: 50px;" id ="yszje"></div>
|
|
|
|
</div>
|
|
|
|
<div class="neironqu">
|
|
|
|
<div>签收情况:</div>
|
|
|
|
<div>
|
|
|
|
本协议约定为分批执行、分期结算。本批次采购订单号根据协议和材料送货清单验收,数量准确,符合要求,申请办理付款结算。
|
|
|
|
<br> 该协议总金额
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div>验收人签字:</div>
|
|
|
|
<div id ="sj3">年 月 日 </div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="neironqu">
|
|
|
|
<div>审核人意见:</div>
|
|
|
|
<div>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div>签字(盖章):</div>
|
|
|
|
<div id ="sj">年 月 日 </div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="neironqu">
|
|
|
|
<div>执行情况确认:</div>
|
|
|
|
<div>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div>签字(盖章):</div>
|
|
|
|
<div id ="sj1">年 月 日 </div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="neironqu">
|
|
|
|
<div>主管领导意见:</div>
|
|
|
|
<div>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<div>签字(盖章):</div>
|
|
|
|
<div id ="sj2">年 月 日 </div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="suom">
|
|
|
|
<div>说明:</div>
|
|
|
|
<div>
|
|
|
|
1.物质类别是指设备、xxx、材料、配件等<br>
|
|
|
|
2.物质类别是指设备、xxx、材料、配件等<br>
|
|
|
|
3.物质类别是指设备、xxx、材料、配件等
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!--endprint-->
|
|
|
|
<button class="dayinann" onclick="preview()">打印</button>
|
|
|
|
<!-- <button class="dayinann" onclick="">预览</button>-->
|
|
|
|
</body>
|
|
|
|
<script>
|
|
|
|
let data = null
|
|
|
|
window.addEventListener('message', messageEvent=> {
|
|
|
|
console.log('儿子收到vue的数据:>>>>>>>>>>>>>>>>>>>>',messageEvent.data);
|
|
|
|
data = messageEvent.data;
|
|
|
|
let tbdw=document.getElementById('tbdw')
|
|
|
|
let wzmc=document.getElementById('wzmc')
|
|
|
|
let lb=document.getElementById('lb')
|
|
|
|
let lb1=document.getElementById('lb1')
|
|
|
|
let xs=document.getElementById('xs')
|
|
|
|
let ghdw=document.getElementById('ghdw')
|
|
|
|
let dhsj=document.getElementById('dhsj')
|
|
|
|
let yszje=document.getElementById('yszje')
|
|
|
|
let sj=document.getElementById('sj')
|
|
|
|
let sj1=document.getElementById('sj1')
|
|
|
|
let sj2=document.getElementById('sj2')
|
|
|
|
let sj3=document.getElementById('sj3')
|
|
|
|
let yszje1 =0;
|
|
|
|
data.map((item,index)=>{
|
|
|
|
yszje1+=Number(item.materialAmount)
|
|
|
|
})
|
|
|
|
tbdw.innerHTML=`填报单位:${data[0].warehouseId_dictText}`
|
|
|
|
yszje.innerHTML=yszje1
|
|
|
|
wzmc.innerHTML=`${data[0].materialDescription},等`
|
|
|
|
lb.innerHTML=`${data[0].accountingAttributes_dictText}`
|
|
|
|
lb1.innerHTML=`${data[0].accountingAttributes_dictText}`
|
|
|
|
ghdw.innerHTML=`${data[0].supplierId}`
|
|
|
|
dhsj.innerHTML=`到货时间:${data[0].storageTime}`
|
|
|
|
let time = new Date();
|
|
|
|
// 获取年
|
|
|
|
let n = time.getFullYear()
|
|
|
|
// 获取月
|
|
|
|
let y= time.getMonth()+1
|
|
|
|
// 获取日
|
|
|
|
let r = time.getDate()
|
|
|
|
sj.innerHTML =n+'年'+ y+'月'+r+'日';
|
|
|
|
sj1.innerHTML =n+'年'+ y+'月'+r+'日';
|
|
|
|
sj2.innerHTML =n+'年'+ y+'月'+r+'日';
|
|
|
|
sj3.innerHTML =n+'年'+ y+'月'+r+'日';
|
|
|
|
xs.innerHTML=`${data.length}`
|
|
|
|
});
|
|
|
|
function preview() {
|
|
|
|
bdhtml = window.document.body.innerHTML;
|
|
|
|
sprnstr = "<!--startprint-->"; //开始打印标识字符串有17个字符
|
|
|
|
eprnstr = "<!--endprint-->"; //结束打印标识字符串
|
|
|
|
prnhtml = bdhtml.substr(bdhtml.indexOf(sprnstr) + 17); //从开始打印标识之后的内容
|
|
|
|
prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr)); //截取开始标识和结束标识之间的内容
|
|
|
|
window.document.body.innerHTML = prnhtml; //把需要打印的指定内容赋给body.innerHTML
|
|
|
|
window.print(); //调用浏览器的打印功能打印指定区域
|
|
|
|
window.document.body.innerHTML = bdhtml; //重新给页面内容赋值;
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
</html>
|