sfms3.0
/
sfms3.0-uniapp
3
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

打印样式修改

hella_online_20240829
zhang_li 3 months ago
parent
5ae6174b2a
commit
6f0c491740
2 changed files with 124 additions and 96 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 65
      src/hybrid/html/pointPutawayJob.html
  2. 155
      src/pages/pointPutawayJob/index.vue

65
src/hybrid/html/pointPutawayJob.html
View File

@ -15,8 +15,8 @@
<style> <style>
.box { .box {
font-size: 13px; font-size: 13px;
/* padding: 10px; /* padding: 10px; */
border: 1px solid #dedede; */ border: 1px solid #dedede;
} }
.left { .left {
@ -70,43 +70,62 @@
.mb-kw { .mb-kw {
border-bottom: 1px solid #dedede; border-bottom: 1px solid #dedede;
padding-bottom: 10px; padding: 10px;
font-size: 15px;
} }
.mb-kw span { .mb-kw div {
font-weight: bold; font-weight: bold;
font-size: 16px; font-size: 23px;
text-align: center;
} }
.mb-text { .mb-bo {
margin-top: 5px; display: flex;
} }
table, th, td {
border: 1px solid rgb(228, 231, 237); .mb-bo .mb-left {
border-collapse: collapse; /* 移除表格内边框间的间隙 */ flex: 1
} }
table{
width: 100%; .mb-bo .mb-left .mb-text {
margin-top: 10px; padding: 10px;
} }
th{
padding: 4px ; .mb-bo .mb-left .mb-text:nth-child(1) {
font-size: 12px; border-bottom: 1px solid #dedede;
}
.mb-bo .mb-left .mb-text div {
font-weight: bold;
font-size: 16px;
text-align: center; text-align: center;
background:rgb(245, 246, 248);
color:rgb(96, 98, 102)
} }
td{
padding: 4px ; .mb-bo .mb-right {
font-size: 12px; padding: 10px;
width: 230px;
border-left: 1px solid #dedede;
display: flex;
align-items: center;
}
.mb-bo .mb-right .mb-text {
width: 100%;
}
.mb-bo .mb-right .mb-text div {
font-weight: bold;
font-size: 20px;
text-align: center; text-align: center;
color:rgb(96, 98, 102) width: 100%;
} }
</style> </style>
</head> </head>
<body> <body>
mainBody mainBody
</body> </body>
</html> </html>

155
src/pages/pointPutawayJob/index.vue
View File

@ -2,22 +2,28 @@
<view class="content" style="padding:30rpx 20rpx 100rpx;min-height: calc(100vh - 120rpx);"> <view class="content" style="padding:30rpx 20rpx 100rpx;min-height: calc(100vh - 120rpx);">
<com-empty-view v-if="data.length==0"></com-empty-view> <com-empty-view v-if="data.length==0"></com-empty-view>
<!-- 只用于展示页面 --> <!-- 只用于展示页面 -->
<view class="box" style="margin-bottom: 20rpx;"> <view class="box" style="margin-bottom: 20rpx;" v-for='(item,index) in data.sublist' :key='index'>
<view class="top"> <view class="top">
<view class="mb-kw"> <view class="mb-kw">
目标库位：<text>{{data.toLocationCode}}</text> 目标库位：<view>{{item.toLocationCode}}</view>
</view> </view>
<view class="mb-text"> <view class="mb-bo">
任务编号：<text>{{data.number}}</text> <view class="mb-left">
<view class="mb-text">
物料号：<view>{{item.itemCode}}</view>
</view>
<view class="mb-text">
托包装号：<view>{{item.packingNumber}}</view>
</view>
</view> </view>
<view class="mb-text"> <view class="mb-right">
创建人：<text>{{data.creator||''}}</text> <view class="mb-text">
数量：<view>{{item.packQty}}个</view>
</view>
</view> </view>
<view class="mb-text">
创建时间：<text>{{formatDate(data.createTime)}}</text>
</view> </view>
</view> </view>
<u-table style="margin-top: 20rpx;"> <!-- <u-table style="margin-top: 20rpx;">
<u-tr> <u-tr>
<u-th>物品代码</u-th> <u-th>物品代码</u-th>
<u-th>物品描述</u-th> <u-th>物品描述</u-th>
@ -27,7 +33,7 @@
<u-th>数量</u-th> <u-th>数量</u-th>
<u-th>计量单位</u-th> <u-th>计量单位</u-th>
</u-tr> </u-tr>
<u-tr v-for="(cur,key) in data.sublist" :key='key'> <u-tr v-for="(cur,key) in item.sublist" :key='key'>
<u-td>{{cur.itemCode}}</u-td> <u-td>{{cur.itemCode}}</u-td>
<u-td>{{cur.itemDesc1}}</u-td> <u-td>{{cur.itemDesc1}}</u-td>
<u-td>{{cur.batch}}</u-td> <u-td>{{cur.batch}}</u-td>
@ -36,7 +42,7 @@
<u-td>{{cur.qty}}</u-td> <u-td>{{cur.qty}}</u-td>
<u-td>{{cur.uom}}</u-td> <u-td>{{cur.uom}}</u-td>
</u-tr> </u-tr>
</u-table> </u-table> -->
</view> </view>
<view class="" style="position: fixed;width: 100%;bottom: 0rpx;left: 0px;"> <view class="" style="position: fixed;width: 100%;bottom: 0rpx;left: 0px;">
<button @click="printImage" <button @click="printImage"
@ -132,23 +138,13 @@
// jobNumber: '555555', // jobNumber: '555555',
// creator: '就是我', // creator: '就是我',
// createTime: '2019-12-12 05:00:00', // createTime: '2019-12-12 05:00:00',
// sublist: [{ // itemNumber: '66',
// itemNumber: '66', // itemDes: 'hahah',
// itemDes: 'hahah', // batch: '201450513',
// batch: '201450513', // packingNumber: '201450513',
// packingNumber: '201450513', // packUnit: '201450513',
// packUnit: '201450513', // packQty: '40',
// packQty: '40', // uom: '张',
// uom: '张'
// },{
// itemNumber: '77',
// itemDes: '8888',
// batch: '201450513',
// packingNumber: '201450513',
// packUnit: '201450513',
// packQty: '40',
// uom: '张'
// }]
// }, { // }, {
// toLocationCode: 'C13-12-11', // toLocationCode: 'C13-12-11',
// jobNumber: '555555', // jobNumber: '555555',
@ -182,53 +178,30 @@
let str = '' let str = ''
this.readFile(htmlFileUrl, (htmlContent) => { this.readFile(htmlFileUrl, (htmlContent) => {
this.newHtmlContent = htmlContent this.newHtmlContent = htmlContent
// this.data.forEach(item => { this.data.sublist.forEach(item => {
str += `<div class="box" style="page-break-before:always;"><br /> str += `<div class="box" style="page-break-before:always;" ><br />
<div class="top"> <div class="top">
<div class="mb-kw"> <div class="mb-kw">
目标库位：<span>${this.data.toLocationCode}</span> 目标库位：<div>${item.toLocationCode}</div>
</div> </div>
<div class="mb-text"> <div class="mb-bo">
任务编号：<span>${this.data.number}</span> <div class="mb-left">
<div class="mb-text">
物料号：<div>${item.itemCode}</div>
</div>
<div class="mb-text">
托包装号：<div>${item.packingNumber}</div>
</div>
</div> </div>
<div class="mb-text"> <div class="mb-right">
创建人：<span>${this.data.creator}</span> <div class="mb-text">
数量：<div>${item.packQty}个</div>
</div>
</div> </div>
<div class="mb-text">
创建时间：<span>${this.formatDate(this.data.createTime)}</span>
</div> </div>
</div> </div>
<table style="margin-top: 20rpx;" style='border-collapse: collapse;'>
<tr>
<th>物品代码</th>
<th>物品描述</th>
<th>批次</th>
<th>包装号</th>
<th>包装规格</th>
<th>数量</th>
<th>计量单位</th>
<tr>
tableTrTd
</table>
<div>
`
let str1 = ''
this.data.sublist.forEach((cur, key) => {
str1 += `
<tr>
<td>${cur.itemCode}</td>
<td>${cur.itemDesc1}</td>
<td>${cur.batch}</td>
<td>${cur.packingNumber}</td>
<td>${cur.packUnit}</td>
<td>${cur.qty}</td>
<td>${cur.uom}</td>
</tr>
` `
}) })
str = str.replace(
"tableTrTd", str1)
// })
this.newHtmlContent = this.newHtmlContent.replace( this.newHtmlContent = this.newHtmlContent.replace(
"mainBody", str); //替换物品代码 "mainBody", str); //替换物品代码
}); });
@ -243,7 +216,7 @@
.box { .box {
font-size: 26rpx; font-size: 26rpx;
/* display: flex; */ /* display: flex; */
padding: 20rpx; /* padding: 20rpx; */
border: 1px solid #dedede; border: 1px solid #dedede;
} }
@ -301,16 +274,52 @@
.mb-kw { .mb-kw {
border-bottom: 1px solid #dedede; border-bottom: 1px solid #dedede;
padding-bottom: 20rpx; padding: 20rpx;
font-size: 30rpx;
} }
.mb-kw text { .mb-kw view {
font-weight: bold;
font-size: 46rpx;
text-align: center;
}
.mb-bo{
display:flex;
}
.mb-bo .mb-left{
flex:1
}
.mb-bo .mb-left .mb-text{
padding: 20rpx;
}
.mb-bo .mb-left .mb-text:nth-child(1){
border-bottom: 1px solid #dedede;
}
.mb-bo .mb-left .mb-text view{
font-weight: bold; font-weight: bold;
font-size: 32rpx; font-size: 32rpx;
text-align: center;
} }
.mb-bo .mb-right{
.mb-text { padding: 20rpx;
width: 260rpx;
border-left: 1px solid #dedede;
display: flex;
align-items: center;
}
.mb-bo .mb-right .mb-text{
width: 100%;
}
.mb-bo .mb-right .mb-text view{
font-weight: bold;
font-size: 40rpx;
text-align: center;
width: 100%;
}
/* .mb-text {
margin-top: 10rpx; margin-top: 10rpx;
} }
@ -323,5 +332,5 @@
font-size: 24rpx !important; font-size: 24rpx !important;
word-break: break-all; word-break: break-all;
} } */
</style> </style>
Write Preview
Loading…
Cancel
Save