licq/heli-mes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

样式调整

Browse Source
This commit is contained in:
BinBin Song 2025-08-03 22:41:03 +08:00
parent 6ff3db5446
commit a9ba9f8f59
4 changed files with 131 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
mes-ui/mes-ui-admin-vue3/src/views/heli/purchaseorder/index.vue
View File

@ -162,13 +162,13 @@ link type="primary" @click="editReceivingStatus(scope.row.id)"
<div class="print-header"> <div class="print-header">
<div class="order-info"> <div class="order-info">
<div style="display: flex;"> <div style="display: flex;">
<span style="width: 210px;">订单编号：{{ printData.purchaseNo }}</span> <span style="width: 190px;white-space: nowrap;">订单编号：{{ printData.purchaseNo }}</span>
<span style="margin-left:20px; width: 170px;">订单日期：{{ formatDate(printData.ordDate) }}</span> <span style="margin-left:10px; width: 150px;">订单日期：{{ formatDate(printData.ordDate) }}</span>
<span style="margin-left:20px;width: 250px">供应商：{{ printData.supplierName }}</span> <span style="margin-left:10px;width: 220px;white-space: nowrap;">供应商：{{ printData.supplierName }}</span>
</div> </div>
<div style="display: flex;"> <div style="display: flex;">
<span style="margin-left:20px;width: 110px">联系人：{{ printData.contactName }}</span> <span style="margin-left:10px;width: 100px">联系人：{{ printData.contactName }}</span>
<span style="margin-left:20px;width: 150px">电话：{{ printData.contactMobile }}</span> <span style="margin-left:10px;width: 140px">电话：{{ printData.contactMobile }}</span>
</div> </div>
</div> </div>
@ -493,6 +493,10 @@ function doPrint() {
<head> <head>
<title >采购单</title> <title >采购单</title>
<style> <style>
@page {
size: 241mm 140mm;
margin: 5mm;
}
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
margin: 10px; margin: 10px;
@ -507,6 +511,7 @@ function doPrint() {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
padding-left:8px
} }
@ -515,36 +520,47 @@ function doPrint() {
} }
.stamp-info span{ .stamp-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.order-info span{ .order-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.print-table { .print-table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin-top: 10px; margin-top: 10px;
table-layout: fixed;
border: 2px solid #000 !important; /* 加粗外边框 */
} }
.print-table th, .print-table td { .print-table th, .print-table td {
border: 1px solid #ddd; border: 1px solid #000 !important; /* 使用黑色边框，更清晰 */
padding: 5px; padding: 2px 0px;
text-align: center; text-align: center;
height: 20px; /* 设置固定高度 */ height: auto;
line-height: 20px; /* 垂直居中 */ min-height: 26px;
// line-height: 1.2;
word-wrap: break-word;
word-break: break-all;
vertical-align: center;
} }
.print-table th { .print-table th {
background-color: #f5f5f5; background-color: #f5f5f5;
font-weight: bold;
border: 1px solid #000 !important;
} }
@media print { /* 特别加强最后一列（备注列）的右边框 */
body { margin: 0; } .print-table th:last-child,
.print-content { .print-table td:last-child {
width: 100%; border-right: 2px solid #000 !important;
margin: 0; white-space: normal !important;
padding: 10px; word-wrap: break-word !important;
} word-break: break-all !important;
overflow-wrap: break-word !important;
padding: 4px 2px;
} }
</style> </style>
</head> </head>
<body> <body>
@ -567,6 +583,7 @@ function limitTo20Chars(input) {
return input.length > 20 ? input.slice(0, 20) : input; return input.length > 20 ? input.slice(0, 20) : input;
} }
</script> </script>
<style scoped> <style scoped>
/* 打印样式 */ /* 打印样式 */
@media print { @media print {
@ -603,7 +620,7 @@ function limitTo20Chars(input) {
} }
.order-info span { .order-info span {
font-size: 15px !important; font-size: 12px !important;
margin-right: 10px !important; margin-right: 10px !important;
} }
.stamp-info { .stamp-info {
@ -611,7 +628,7 @@ function limitTo20Chars(input) {
} }
.stamp-info span{ .stamp-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.print-table { .print-table {
@ -641,4 +658,4 @@ function limitTo20Chars(input) {
</style> </style>

57
mes-ui/mes-ui-admin-vue3/src/views/heli/purchaseorderno/detail.vue
View File

@ -100,13 +100,13 @@
<div class="print-header"> <div class="print-header">
<div class="order-info"> <div class="order-info">
<div style="display: flex;"> <div style="display: flex;">
<span style="width: 210px;">订单编号：{{ printData.purchaseNo }}</span> <span style="width: 200px;">订单编号：{{ printData.purchaseNo }}</span>
<span style="margin-left:20px; width: 170px;">订单日期：{{ formatDate(printData.ordDate) }}</span> <span style="margin-left:10px; width: 110px;">订单日期：{{ formatDate(printData.ordDate) }}</span>
<span style="margin-left:20px;width: 250px">供应商：{{ printData.supplierName }}</span> <span style="margin-left:10px;width: 210px; white-space: nowrap;">供应商：{{ printData.supplierName }}</span>
</div> </div>
<div style="display: flex;"> <div style="display: flex;">
<span style="margin-left:20px;width: 110px">联系人：{{ printData.contactName }}</span> <span style="margin-left:10px;width: 100px">联系人：{{ printData.contactName }}</span>
<span style="margin-left:20px;width: 150px">电话：{{ printData.contactMobile }}</span> <span style="margin-left:10px;width: 100px">电话：{{ printData.contactMobile }}</span>
</div> </div>
</div> </div>
@ -326,6 +326,10 @@ function doPrint() {
<head> <head>
<title >采购单</title> <title >采购单</title>
<style> <style>
@page {
size: 241mm 140mm;
margin: 5mm;
}
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
margin: 10px; margin: 10px;
@ -340,6 +344,7 @@ function doPrint() {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
padding-left:8px
} }
@ -348,36 +353,47 @@ function doPrint() {
} }
.stamp-info span{ .stamp-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.order-info span{ .order-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.print-table { .print-table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin-top: 10px; margin-top: 10px;
table-layout: fixed;
border: 2px solid #000 !important; /* 加粗外边框 */
} }
.print-table th, .print-table td { .print-table th, .print-table td {
border: 1px solid #ddd; border: 1px solid #000 !important; /* 使用黑色边框，更清晰 */
padding: 5px; padding: 2px 0px;
text-align: center; text-align: center;
height: 20px; /* 设置固定高度 */ height: auto;
line-height: 20px; /* 垂直居中 */ min-height: 26px;
// line-height: 1.2;
word-wrap: break-word;
word-break: break-all;
vertical-align: center;
} }
.print-table th { .print-table th {
background-color: #f5f5f5; background-color: #f5f5f5;
font-weight: bold;
border: 1px solid #000 !important;
} }
@media print { /* 特别加强最后一列（备注列）的右边框 */
body { margin: 0; } .print-table th:last-child,
.print-content { .print-table td:last-child {
width: 100%; border-right: 2px solid #000 !important;
margin: 0; white-space: normal !important;
padding: 10px; word-wrap: break-word !important;
} word-break: break-all !important;
overflow-wrap: break-word !important;
padding: 4px 2px;
} }
</style> </style>
</head> </head>
<body> <body>
@ -487,7 +503,7 @@ const getList = async () => {
} }
.order-info span { .order-info span {
font-size: 15px !important; font-size: 12px !important;
margin-right: 10px !important; margin-right: 10px !important;
} }
.stamp-info { .stamp-info {
@ -495,7 +511,7 @@ const getList = async () => {
} }
.stamp-info span{ .stamp-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.print-table { .print-table {
@ -526,3 +542,4 @@ const getList = async () => {
</style> </style>

80
mes-ui/mes-ui-admin-vue3/src/views/heli/purchaseorderno/managementdetail.vue
View File

@ -79,13 +79,13 @@
<div class="print-header"> <div class="print-header">
<div class="order-info"> <div class="order-info">
<div style="display: flex;"> <div style="display: flex;">
<span style="width: 210px;">订单编号：{{ printData.purchaseNo }}</span> <span style="width: 200px;">订单编号：{{ printData.purchaseNo }}</span>
<span style="margin-left:20px; width: 170px;">订单日期：{{ formatDate(printData.ordDate) }}</span> <span style="margin-left:10px; width: 140px;">订单日期：{{ formatDate(printData.ordDate) }}</span>
<span style="margin-left:20px;width: 250px">供应商：{{ printData.supplierName }}</span> <span style="margin-left:10px;width: 220px">供应商：{{ printData.supplierName }}</span>
</div> </div>
<div style="display: flex;"> <div style="display: flex;">
<span style="margin-left:20px;width: 110px">联系人：{{ printData.contactName }}</span> <span style="margin-left:10px;width: 100px">联系人：{{ printData.contactName }}</span>
<span style="margin-left:20px;width: 150px">电话：{{ printData.contactMobile }}</span> <span style="margin-left:10px;width: 120px">电话：{{ printData.contactMobile }}</span>
</div> </div>
</div> </div>
@ -150,21 +150,21 @@
</tbody> </tbody>
</table> </table>
<div class="order-info" style="margin-top: 10px;border-bottom: 1px solid #ccc;padding-bottom: 10px;"> <div class="order-info" style="margin-top: 10px; border-bottom: 1px solid #ccc; padding-bottom: 10px;">
<div style="display: flex;width: 40%;"> <div style="display: flex; width: 40%;">
<span >交货地址：{{ printData.deliveryAddress }}</span> <span style="white-space: nowrap;">交货地址：{{ printData.deliveryAddress }}</span>
</div> </div>
<div style="display: flex;width: 20%;justify-content: center;">
<span style="margin-left:20px;width: 150px">审核：{{ printData.auditorName }}</span>
<span style="margin-left:20px;width: 120px">签字区</span>
<div style="display: flex; width: 20%; justify-content: center;">
<span style="margin-left: 20px; width: 150px; white-space: nowrap;">审核：{{ printData.auditorName }}</span>
<span style="margin-left: 20px; width: 120px; white-space: nowrap;">签字区</span>
</div> </div>
<div style="display: flex; width: 40%;justify-content: right;">
<span style="margin-left:20px;width: 130px">接收人：{{ printData.username }}</span> <div style="display: flex; width: 40%; justify-content: right;">
<span style="margin-left:20px;width: 150px">电话：{{ printData.userMobile }}</span> <span style="margin-left: 20px; width: 130px; white-space: nowrap;">接收人：{{ printData.username }}</span>
</div> <span style="margin-left: 20px; width: 150px; white-space: nowrap;">电话：{{ printData.userMobile }}</span>
</div> </div>
</div>
</div> </div>
@ -302,6 +302,10 @@ function doPrint() {
<head> <head>
<title >采购单</title> <title >采购单</title>
<style> <style>
@page {
size: 241mm 140mm;
margin: 5mm;
}
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
margin: 10px; margin: 10px;
@ -316,6 +320,7 @@ function doPrint() {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
padding-left:8px
} }
@ -324,36 +329,47 @@ function doPrint() {
} }
.stamp-info span{ .stamp-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.order-info span{ .order-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.print-table { .print-table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin-top: 10px; margin-top: 10px;
table-layout: fixed;
border: 2px solid #000 !important; /* 加粗外边框 */
} }
.print-table th, .print-table td { .print-table th, .print-table td {
border: 1px solid #ddd; border: 1px solid #000 !important; /* 使用黑色边框，更清晰 */
padding: 5px; padding: 2px 0px;
text-align: center; text-align: center;
height: 20px; /* 设置固定高度 */ height: auto;
line-height: 20px; /* 垂直居中 */ min-height: 26px;
// line-height: 1.2;
word-wrap: break-word;
word-break: break-all;
vertical-align: center;
} }
.print-table th { .print-table th {
background-color: #f5f5f5; background-color: #f5f5f5;
font-weight: bold;
border: 1px solid #000 !important;
} }
@media print { /* 特别加强最后一列（备注列）的右边框 */
body { margin: 0; } .print-table th:last-child,
.print-content { .print-table td:last-child {
width: 100%; border-right: 2px solid #000 !important;
margin: 0; white-space: normal !important;
padding: 10px; word-wrap: break-word !important;
} word-break: break-all !important;
overflow-wrap: break-word !important;
padding: 4px 2px;
} }
</style> </style>
</head> </head>
<body> <body>
@ -442,7 +458,7 @@ const getList = async () => {
} }
.order-info span { .order-info span {
font-size: 15px !important; font-size: 12px !important;
margin-right: 10px !important; margin-right: 10px !important;
} }
.stamp-info { .stamp-info {
@ -450,7 +466,7 @@ const getList = async () => {
} }
.stamp-info span{ .stamp-info span{
font-size: 15px !important; font-size: 12px !important;
} }
.print-table { .print-table {

42
mes-ui/mes-ui-admin-vue3/src/views/heli/storagein/detail.vue
View File

@ -273,6 +273,10 @@ function doPrint() {
<head> <head>
<title >入库单</title> <title >入库单</title>
<style> <style>
@page {
size: 241mm 140mm;
margin: 5mm;
}
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
margin: 10px; margin: 10px;
@ -312,11 +316,11 @@ function doPrint() {
} }
.print-table th, .print-table td { .print-table th, .print-table td {
border: 1px solid #000 !important; /* 使用黑色边框，更清晰 */ border: 1px solid #000 !important; /* 使用黑色边框，更清晰 */
padding: 4px; padding: 2px 0px;
text-align: center; text-align: center;
height: auto; height: auto;
min-height: 30px; min-height: 26px;
line-height: 1.4; line-height: 1.2;
word-wrap: break-word; word-wrap: break-word;
word-break: break-all; word-break: break-all;
vertical-align: top; vertical-align: top;
@ -336,37 +340,7 @@ function doPrint() {
overflow-wrap: break-word !important; overflow-wrap: break-word !important;
padding: 4px 2px; padding: 4px 2px;
} }
@media print {
body {
margin: 0;
-webkit-print-color-adjust: exact !important;
color-adjust: exact !important;
}
.print-content {
width: 100%;
margin: 0;
padding: 8px; /* 减少内边距，避免被裁剪 */
box-sizing: border-box;
}
.print-table {
page-break-inside: avoid;
border: 2px solid #000 !important;
width: 98% !important; /* 稍微减小宽度，避免右边框被裁剪 */
margin: 0 auto;
margin-top:10px
}
.print-table th, .print-table td {
border: 1px solid #000 !important;
-webkit-print-color-adjust: exact !important;
color-adjust: exact !important;
}
.print-table th:last-child,
.print-table td:last-child {
border-right: 2px solid #000 !important;
white-space: normal !important;
word-wrap: break-word !important;
}
}
</style> </style>
</head> </head>
<body> <body>