打印优化
This commit is contained in:
parent
649226311b
commit
7758d128dc
|
|
@ -166,7 +166,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<table border="1" cellspacing="0" cellpadding="8" style="width: 100%; border-collapse: collapse">
|
||||
<table border="1.5" cellspacing="0" cellpadding="8" style="width: 100%; border-collapse: collapse">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 60px; text-align: center">序号</th>
|
||||
|
|
@ -430,6 +430,13 @@ export default {
|
|||
this.$modal.msgSuccess('单据文件已保存到服务器')
|
||||
|
||||
// 上传成功后执行打印
|
||||
const images = element.querySelectorAll('img')
|
||||
images.forEach(img => {
|
||||
if (!img.complete || img.naturalWidth === 0) {
|
||||
console.warn('图片加载失败,替换为透明图:', img.src)
|
||||
img.src = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' // 透明1x1
|
||||
}
|
||||
})
|
||||
printJS({
|
||||
printable: 'checkId',
|
||||
type: 'html',
|
||||
|
|
@ -456,6 +463,13 @@ export default {
|
|||
this.$modal.msgError('上传单据文件时发生错误')
|
||||
|
||||
// 即使上传失败也执行打印
|
||||
const images = element.querySelectorAll('img')
|
||||
images.forEach(img => {
|
||||
if (!img.complete || img.naturalWidth === 0) {
|
||||
console.warn('图片加载失败,替换为透明图:', img.src)
|
||||
img.src = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' // 透明1x1
|
||||
}
|
||||
})
|
||||
printJS({
|
||||
printable: 'checkId',
|
||||
type: 'html',
|
||||
|
|
@ -589,6 +603,13 @@ export default {
|
|||
this.$modal.msgSuccess('单据PDF文件已保存到服务器')
|
||||
|
||||
// 上传成功后执行打印
|
||||
const images = element.querySelectorAll('img')
|
||||
images.forEach(img => {
|
||||
if (!img.complete || img.naturalWidth === 0) {
|
||||
console.warn('图片加载失败,替换为透明图:', img.src)
|
||||
img.src = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' // 透明1x1
|
||||
}
|
||||
})
|
||||
printJS({
|
||||
printable: 'checkIdTwo',
|
||||
type: 'html',
|
||||
|
|
@ -603,6 +624,13 @@ export default {
|
|||
this.$modal.msgError('上传明细单据文件时发生错误')
|
||||
|
||||
// 即使上传失败也执行打印
|
||||
const images = element.querySelectorAll('img')
|
||||
images.forEach(img => {
|
||||
if (!img.complete || img.naturalWidth === 0) {
|
||||
console.warn('图片加载失败,替换为透明图:', img.src)
|
||||
img.src = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' // 透明1x1
|
||||
}
|
||||
})
|
||||
printJS({
|
||||
printable: 'checkIdTwo',
|
||||
type: 'html',
|
||||
|
|
@ -660,13 +688,84 @@ export default {
|
|||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
@media print {
|
||||
.no-print {
|
||||
display: none;
|
||||
@media screen {
|
||||
body {
|
||||
font-family: 'Microsoft YaHei', sans-serif;
|
||||
background-color: #f5f5f5;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.print-content {
|
||||
/* 打印内容的样式 */
|
||||
.print-container {
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
background: white;
|
||||
padding: 20px;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
text-align: center;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 10px 20px;
|
||||
margin: 0 10px;
|
||||
background: #409eff;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background: #66b1ff;
|
||||
}
|
||||
}
|
||||
|
||||
/* 通用样式 */
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
margin: 15px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.info-item {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.signature-area {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.signature-box {
|
||||
width: 30%;
|
||||
min-height: 100px;
|
||||
border-bottom: 1px solid #000;
|
||||
text-align: center;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.is-rotate {
|
||||
transform: rotate(90deg);
|
||||
transform-origin: center center;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -21,9 +21,9 @@
|
|||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="keyword">
|
||||
<el-form-item prop="keyWord">
|
||||
<el-input
|
||||
v-model="queryParams.keyword"
|
||||
v-model="queryParams.keyWord"
|
||||
placeholder="请输入关键字"
|
||||
clearable
|
||||
maxlength="50"
|
||||
|
|
@ -269,7 +269,7 @@ export default {
|
|||
time: null, //申请时间
|
||||
name: undefined,
|
||||
taskStatus: "",
|
||||
keyword: "",
|
||||
keyWord: "",
|
||||
},
|
||||
form: {
|
||||
remark: "",
|
||||
|
|
@ -351,7 +351,7 @@ export default {
|
|||
getList() {
|
||||
this.loading = true;
|
||||
const params = {
|
||||
keyword: this.queryParams.keyword,
|
||||
keyWord: this.queryParams.keyWord,
|
||||
startTime: this.queryParams.time && this.queryParams.time[0],
|
||||
endTime: this.queryParams.time && this.queryParams.time[1],
|
||||
pageSize: this.queryParams.pageSize,
|
||||
|
|
@ -377,7 +377,7 @@ export default {
|
|||
start.setMonth(start.getMonth() - 1)
|
||||
this.queryParams.time = [this.format(start), this.format(end)]
|
||||
this.resetForm("queryForm");
|
||||
this.queryParams.keyword = "";
|
||||
this.queryParams.keyWord = "";
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 通过按钮操作 */
|
||||
|
|
@ -569,8 +569,8 @@ export default {
|
|||
watch: {
|
||||
$route: {
|
||||
handler(to) {
|
||||
if (to.query.keyword) {
|
||||
this.queryParams.keyword = to.query.keyword;
|
||||
if (to.query.keyWord) {
|
||||
this.queryParams.keyWord = to.query.keyWord;
|
||||
}
|
||||
},
|
||||
deep: true,
|
||||
|
|
|
|||
Loading…
Reference in New Issue