二维码

This commit is contained in:
hezhengao 2024-04-19 10:16:24 +08:00
parent 89be263ca7
commit aeed28a7d7
1 changed files with 11 additions and 4 deletions

View File

@ -77,7 +77,7 @@
<!-- 二维码 --> <!-- 二维码 -->
<el-dialog :visible.sync="codeOpen" width="450px" append-to-body> <el-dialog :visible.sync="codeOpen" width="450px" append-to-body>
<div id="printdata"> <div id="printdata">
<div> <div class="printdata-item">
<div >项目名称<span>{{ this.titles }}</span></div> <div >项目名称<span>{{ this.titles }}</span></div>
<div> <div>
<vue-qr :width="400" ref="qrCode" :text="texturl" :logoSrc="logoSrc" :color-dark="randomColor" ></vue-qr> <vue-qr :width="400" ref="qrCode" :text="texturl" :logoSrc="logoSrc" :color-dark="randomColor" ></vue-qr>
@ -313,18 +313,25 @@ export default {
} }
@media print { @media print {
@page { @page {
size: auto; /* 设置打印页面大小为自动 */ size: auto; /* 设置打印页面大小为自动 */
margin: 0; /* 设置打印页面的页边距为0去除默认页眉和页脚 */ margin: 0; /* 设置打印页面的页边距为0去除默认页眉和页脚 */
} }
#printdata { #printdata {
display: flex; display: flex;
justify-content: center; /* 水平居中 */ justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */ align-items: center; /* 垂直居中 */
width: 100vw;
height: 100vh; /* 设置高度为视口高度,使内容居中显示 */ height: 100vh; /* 设置高度为视口高度,使内容居中显示 */
// transform: scale(2); /* 2 */
}
.printdata-item{
transform: scale(3); /* 设置二维码放大倍数这里是放大2倍可以根据需要调整 */ transform: scale(3); /* 设置二维码放大倍数这里是放大2倍可以根据需要调整 */
} }
/* 如果需要额外样式,可以在这里添加 */ /* 如果需要额外样式,可以在这里添加 */
} }