Hi there!
I have been struggling with creating a readable (simple, visually acceptable) PDF file on the client side from an UI5 view that consists of various tables/lists and forms (uxap page). At first I tried the simple way of using the Google Chrome's 'Print as PDF' solution, but the generated pdf ends somewhat in the middle of the page (basically prints only the part what you see).
That is when I started fiddling with the jsPdf as it has various options how to create a pdf. I would prefer the data to be as text (not image). At first I tried to create the pdf just by giving the main div id, that resulted in errors from the jsPdf generator (something to do with the wrapper divs, i guess).
So, without finding a 'magic', easy, automatic way to generate my view to pdf i started writing a code that gets the structured object, holding all of the data of the view, and starts 'walking' with it. The walk method checks the type of the part - when the part is type of array, it uses jsPdf.autoTable to create a table and when the part is an object, it should create a form type of thingie from the key-value pairs.
Right now I have managed to finish the prototype for the autotable part, but I am facing some problems - the tables have often lots of columns and the visual result is not very appealing. Furthermore - as the object keys are like 'firstName' or worse.. 'upFlrMgmgngmgnnt' (made that up.. but 'Upper Floor Management' would be the case), I still would have to write all the column names in the code (not the dynamic * let header = [Object.keys(aTable[0]).reduce(function (acc, current) { acc[current] = current; return acc; }, {})]; * way of creating the pdf I was going for).
So - If anyone has some advice on generating such (big) pdf from an UI5 page, I would be very interested about hearing your approach or thoughts about this - maybe you can share your knowledge :).
Best regards,
Mario