vue3中pdf打印问题处理

1 get请求参数问题
之前的请求是post得不到参数,今天发现的问题很奇怪,从前端进入网关,网关居然得不到参数。
前端代码

const print = () => {let linkUrlStr = proxy.$tool.getUrlStr(proxy.$api.invOrder.psiInvOrder.printSalOutstock,{asId:userInfo.value.currentAsId,recvStatus:condForm.value.recvStatus,busiType:condForm.value.busiType,startBillDate:condForm.value.billDateRange[0],endBillDate:condForm.value.billDateRange[1],token:proxy.$tool.cookie.get(sysConfig.TOKEN_NAME),Group : 'eayc',Tenat : 'psi',})window.open(linkUrlStr,'_blank');
}
tool.getUrlStr = (url,params) => {//对象 拼接成 & 字符串if (!params) return url;let result = url + "?";params &&Object.keys(params).forEach((item) => (result += `${item}=${params[item]}&`));return result.slice(0, -1);
}

浏览器新打开页面可以看到参数
1
但进去到网关后,
1
查看一个正确案例的如下,uri应该是要有参数的
2
直接讲请求参数复制到地址栏,是可以访问到数据的。但因为是get请求,时间需要做转换.使用@DateTimeFormat(pattern = "yyyy-MM-dd")
1
如果将url复制到浏览器中请求网关是可以的。为何通过node中转却不行呢?
在另外一个工程上面的处理方案是ok的,这种办法简单而有效。为什么在新的工程中反而出了问题呢?
1
既然这条路在这个工程实在走不下去,那么采取“变则通”的方案,不采用get,还是采用post。拿到文件流后,再调用winow.open打开
调整后的代码如下

const print = async () => {const res = await proxy.$api.invOrder.psiInvOrder.printSalOutstock({...condForm.value})const blob = new Blob([res.data], { type: 'application/pdf' })let url = window.URL.createObjectURL(blob)const page = window.open(url, '_blank')// 因为window.open,故而需要增加延迟,否则标题为空setTimeout(function() { page.document.title = '销售出库单' }, 100)
}
	public postOnlyFile = (url: string, data = {} , config: AxiosRequestConfig<any> = {}): Promise<any> =>axios({...this.baseConfig,headers:{...this.baseConfig.headers,'Content-Type': "application/json"},responseType:'blob',url,method: 'post',data,...config,})

2 pdf页面样式问题
pdf是通过easyexcel先生成excel,然后再转为pdf。

    @Overridepublic void print(OutputStream outputStream, String pathName, PsiInvOrderDto psiInvOrderDto) {Resource resource = new ClassPathResource(pathName);InputStream inputStream = null;String fileName = DateUtil.getDateRandom() + ".xls";File file = new File(TmpDic.url + File.separator + fileName);try {inputStream = resource.getInputStream();FileUtils.copyInputStreamToFile(inputStream, file);} catch (IOException e) {e.printStackTrace();}ExcelWriter excelWriter = EasyExcel.write(outputStream).withTemplate(file).build();WriteSheet writeSheet = EasyExcel.writerSheet(0)//单元格.registerWriteHandler(new NoRedStyleCellHander()).build();FillConfig fillConfig = FillConfig.builder().forceNewRow(Boolean.TRUE).build();excelWriter.fill(psiInvOrderDto.getOrderDetails(), fillConfig, writeSheet);excelWriter.fill(psiInvOrderDto, writeSheet);excelWriter.finish();file.delete();}

设置单元格样式

@Slf4j
public class NoRedStyleCellHander implements CellWriteHandler {/*** 样式类*/private CellStyle cellStyle;@Overridepublic void beforeCellCreate(WriteSheetHolder writeSheetHolder, WriteTableHolder writeTableHolder, Row row, Head head, Integer integer, Integer integer1, Boolean aBoolean) {}@Overridepublic void afterCellCreate(WriteSheetHolder writeSheetHolder, WriteTableHolder writeTableHolder, Cell cell, Head head, Integer integer, Boolean aBoolean) {}@Overridepublic void afterCellDataConverted(WriteSheetHolder writeSheetHolder, WriteTableHolder writeTableHolder, CellData cellData, Cell cell, Head head, Integer integer, Boolean aBoolean) {}@Overridepublic void afterCellDispose(WriteSheetHolder writeSheetHolder, WriteTableHolder writeTableHolder, List<CellData> list, Cell cell, Head head, Integer integer, Boolean aBoolean) {if (cellStyle == null) {cellStyle = writeSheetHolder.getSheet().getWorkbook().createCellStyle();}if (cellStyle!=null){//背景颜色cellStyle.setFillPattern(FillPatternType.SOLID_FOREGROUND);cellStyle.setFillForegroundColor(IndexedColors.WHITE.getIndex());// 下边框cellStyle.setBorderBottom(BorderStyle.THIN);// 左边框cellStyle.setBorderLeft(BorderStyle.THIN);// 上边框cellStyle.setBorderTop(BorderStyle.THIN);// 右边框cellStyle.setBorderRight(BorderStyle.THIN);Font font = writeSheetHolder.getSheet().getWorkbook().createFont();font.setBold(true);cellStyle.setFont(font);//设置金额格式if (cell.getCellType() == CellType.NUMERIC.getCode()) {Workbook workbook = cell.getSheet().getWorkbook();DataFormat dataFormat = workbook.createDataFormat();cellStyle.setDataFormat(dataFormat.getFormat("#,##0.00"));}cell.setCellStyle(cellStyle);}}
}

得到的是这样的pdf,可以看到合并单位格的地方都是漆黑一片.如果上面的代码没有添加.registerWriteHandler(new NoRedStyleCellHander()),则是一片漆黑
2
原本我的excel模板是这样的,那么如何解决这个问题呢?
2
通过调整wps的配置,同时去掉registerWriteHandler(new NoRedStyleCellHander()).
在excel模板中讲底色调整为白色,将边框设置为"无边框"
1
模板如下:
1
得到的效果如下:
2
看到上面的效果,就很容易明白,为什么还有黑色,因为你需要将单元填充为白色,那么内容就显示出来了。
2
接着再看,为什么标题没有出来呢?销售出库单跟其他有什么区别吗,为什么其他的可以出来,而标题不能出来。既然其他的可以出来,而标题不能出来,他们的区别在于字体大小不一致,那么问题就很可能出在这里。朝这个方向来探究,就知道了。设置行高。
1
再看,问题解决了
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/230406.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

error:0308010C:digital envelope routines::unsupported 前端项目错误

直接启动命令中增加&#xff1a; SET NODE_OPTIONS--openssl-legacy-provider && vue-cli-service serve

【电商项目实战】实现订单超时支付取消

&#x1f389;&#x1f389;欢迎来到我的CSDN主页&#xff01;&#x1f389;&#x1f389; &#x1f3c5;我是Java方文山&#xff0c;一个在CSDN分享笔记的博主。&#x1f4da;&#x1f4da; &#x1f31f;推荐给大家我的专栏《电商项目实战》。&#x1f3af;&#x1f3af; &am…

客服智能管理系统是如何应用的

客服系统有很多种类&#xff0c;针对不同场景的客服使用的客服系统也不同&#xff0c;如有网店里的在线客服、实体店里的电话客服、网站上的在线客服、公共服务型的热线客服、售后服务客服等等。所谓客服智能管理系统就是一种可以把多个客服场景都管理起来的系统&#xff0c;提…

【Proteus仿真】【STM32单片机】超声波测距系统

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真STM32单片机控制器&#xff0c;使用动态数码管、按键、HCSR04超声波、蜂鸣器模块等。 主要功能&#xff1a; 系统运行后&#xff0c;数码管显示超声波检测距离&#xff0c;当检测…

Vue中的计算属性与监听器

聚沙成塔每天进步一点点 ⭐ 专栏简介 Vue学习之旅的奇妙世界 欢迎大家来到 Vue 技能树参考资料专栏!创建这个专栏的初衷是为了帮助大家更好地应对 Vue.js 技能树的学习。每篇文章都致力于提供清晰、深入的参考资料,让你能够更轻松、更自信地理解和掌握 Vue.js 的核心概念和技…

面试题:你如何理解 System.out.println()?

文章目录 前言首先分析System源码&#xff1a;out源码分析println分析 前言 如果你能自己读懂System.out.println()&#xff0c;就真正了解了Java面向对象编程的含义。 面向对象编程即创建了对象&#xff0c;所有的事情让对象帮亲力亲为&#xff08;即对象调用方法&#xff09…

k Nearest Neighbour(KNN)建模

介绍&#xff1a; K最近邻&#xff08;K-Nearest Neighbors&#xff0c;KNN&#xff09;是一种基本的分类和回归算法。它的基本思想是对未知样本进行预测时&#xff0c;先找到训练数据集中与该样本最近的K个样本&#xff0c;然后根据这K个样本的标签进行预测。 KNN模型的基本步…

神经网络的核心:帮助新手理解 PyTorch 非线性激活函数

目录 torch.nn子函数非线性激活详解 nn.Softmin Softmin 函数简介 函数工作原理 参数详解 使用技巧与注意事项 示例代码 nn.Softmax Softmax 函数简介 函数工作原理 参数详解 使用技巧与注意事项 示例代码 nn.Softmax2d Softmax2d 函数简介 函数工作原理 输入…

Python 自学(四) 之元组字典与集合

目录 1. 列表&#xff0c;元组&#xff0c;字典与集合的区别 2. 元组的创建和删除 tuple() del P101 3. 单个元素的元组 P102 4. 元组元素的修改 P106 5. 元组的使用场景 6. 字典的创建和删除 dict() zip() : del clear() P1…

金融中IC和IR的定义

当谈到金融领域时&#xff0c;IC&#xff08;Information Coefficient&#xff09;和IR&#xff08;Information Ratio&#xff09;通常是用来评估投资组合管理绩效的指标。它们都涉及到投资者对信息的利用和管理的效果。 信息系数&#xff08;IC - Information Coefficient&a…

Spring高手之路-Spring中Bean的五大作用域

目录 Singleton&#xff08;单例&#xff09;&#xff1a;默认的作用域 Prototype&#xff08;原型&#xff09; Request&#xff08;请求&#xff09; Session&#xff08;会话&#xff09; Global Session&#xff08;全局会话&#xff09; 五大作用域范围对比 作用域…

计算机毕业设计——SpringBoot 招投标 任务发布网站(附源码)

1&#xff0c;绪论 在市场范围内&#xff0c;任务发布网站很受欢迎&#xff0c;有很多开发者以及其他领域的牛人&#xff0c;更倾向于选择工作时间、工作场景更自由的零工市场寻求零散单子来补贴家用。 如今市场上&#xff0c;任务发布网站鱼龙混杂&#xff0c;用户需要找一个…

获取CNN/DM适用于评估Bart的格式的数据集(类似于test.source、test.source.tokenized)

项目场景&#xff1a; 复现文本摘要任务评估CNN/DM数据集 问题描述 abisee老哥的代码获取的是bin格式的数据集 时间久远&#xff0c;一些依赖的配置版本难以复现 笔者需要能评估Bart 格式的数据集 形式类似于test.source、test.source.tokenized 解决方案&#xff1a; 经过坚…

霹雳吧啦Wz《pytorch图像分类》-p5ResNet网络

《pytorch图像分类》p5ResNet网络结构 1 网络中的亮点1.1 超深的网络结构1.2 residual模块1.3 Batch Normalization1.4 迁移学习简介 2 模块类代码2.1 BasicBlock&#xff08;18 & 32 layers&#xff09;2.2 Bottleneck&#xff08;50 & 101 & 152 layers&#xff…

vue-cli创建项目时由esLint校验导致报错或警告的问题及解决

vue-cli创建项目时由esLint校验导致报错或警告的问题及解决 一、万能办法 一、万能办法 //就是在报错的JS文件中第一行写上 /* eslint-disable */链接: https://www.yii666.com/blog/288808.html 其它的方法我遇见了再补充

docker的安装的详细教程,以及出现错的解决办法(阿里云)

docker的安装与使用 1.安装dnf sudo yum -y install dnf Repository extras is listed more than once in the configuration 错误&#xff1a;无法为仓库 appstream 找到一个有效的 baseurl 出现这个错误这是由于阿里云的版本导致的 在阿里云开发者社区有答案&#xff01…

什么是软件安全性测试?如何进行安全测试?

一、什么是软件安全性测试&#xff1f; 软件安全性测试是指对软件系统中的安全漏洞进行检测和评估的过程。其目的是为了确保软件系统在面对各种安全威胁时能够保持其功能的完整性、可用性和机密性。 二、软件安全性测试可以通过以下几个步骤来进行&#xff1a; 1. 需求分析&a…

Django 学习教程- Hello world入门案例

系列 Django 学习教程-介绍与安装-CSDN博客 欢迎来到第Djagno学习教程第二章Hello World 入门案例。 在本教程中&#xff0c;我将引导您完成django的Hello World入门案例。 让我们开始吧&#xff01; 版本 Django 5.0Python 3.10 创建项目 安装 Django 之后&#xff0…

数字孪生与物联网(IoT)技术的结合

数字孪生与物联网&#xff08;IoT&#xff09;技术的结合可以在多个领域实现更智能、更高效的应用。以下是数字孪生在物联网技术中的一些应用&#xff0c;希望对大家有所帮助。北京木奇移动技术有限公司&#xff0c;专业的软件外包开发公司&#xff0c;欢迎交流合作。 1.实时监…

把苹果手机上的备忘录转为长图片,分享给别人方法教程

在这个信息爆炸的时代&#xff0c;手机备忘录几乎成了我随身携带的“记忆宝库”。每当我脑海中闪现出一个想法、灵感或是需要记住的重要事项&#xff0c;我都会第一时间打开苹果手机的备忘录&#xff0c;将它们一一记录下来。备忘录的简洁界面和高效操作总能让我在忙碌的生活中…