motla / vue-document-editor

:page_facing_up: Paper-sized WYSIWYG document editor for Vue apps
https://motla.github.io/vue-document-editor/
MIT License
313 stars 70 forks source link

The page number overlay does not appear on the last page. (Inside the modal) #26

Closed malgirlim closed 1 year ago

malgirlim commented 1 year ago

** It is a sentence written using a translation program. Please forgive me.

Describe the bug The page number overlay does not appear on the last page. (Inside the modal)

To Reproduce Steps to reproduce the behavior:

  1. Import components(Demo.vue) from within the Modal.
  2. On the browser screen, you can see that the last page overlay appears.
  3. Press the Print button.
  4. You can see that there is no page number overlay on the last page.

Expected behavior As a result of the test, the problem occurred only inside the Modal and no problem outside the Modal. But I thought it might be a problem because it was different from the template environment I was using.

Screenshots [If applicable, add screenshots to help explain your problem. https://imgur.com/a/b1Ye5b2

Desktop (please complete the following information):

Additional context I am a novice developer, and I am working on a project using a template. Templates use Vue3, TypeScript, and Vite. This environment seems to be causing problems, but I couldn't find them with my ability. Here's the github repertoire that reproduced my problem. https://github.com/malgirlim/Print-Test

It's a really great solution, so I want to solve the problem and use it. Please give me a little help. Thank you.

malgirlim commented 1 year ago

For similar issues, when you set the print layout to landscape (A4L) and print it out, a blank page appears in the last chapter. This is also implemented on the demo site. Screenshots : https://imgur.com/a/1xjIZAb

motla commented 1 year ago

Hi @malgirlim

Thanks for your bug reports. I'm sorry for the delay but I have been very busy lately and your bugs were not trivial to solve.

I couldn't find a way to solve the first one (missing page number). I think it has to do with the CSS formatting of your page... But what is weird is, when I call the DocumentEditor.vue before_print() function manually, and then I call window.print(), it works. But when I just call window.print() (which calls before_print() under the hood), it doesn't work.

However I managed to solve the blank page issue, it had to do with page overlays. I just released v2.3.0 (Vue3) and v1.5.0 (Vue2).

I let the issue open in case somebody finds a way to solve the first one... Let me know if you manage to find a workaround.

motla commented 1 year ago

While solving the issue of the blank page I managed to create another issue, some page numbers are missing again from the print... 😰 I'm working on a fix...

motla commented 1 year ago

Ok I finally found a way, I just released v2.3.1 (Vue3) and v1.5.1 (Vue2), which I think I managed to fix both your bugs. Please let me know if you still have issues.