Vue.jsを利用したWebシステムで帳票印刷する必要がありました。 方法がいくつかあり、検討した知見を紹介します。 背景 フロントはVue.jsを利用したSPA 指定条件を入力しビジネスの統計情報を画面表示する 集計、グラフを伴う 統計画面上の「印刷」ボタンを押下すると帳票印刷 or PDFダウンロードする ビジネスレポートは複数ページに渡る 数値の集計表、グラフなどを伴う ヘッダ/フッタなどの体裁はこだわらない また、画面ページ上の統計情報と印刷ページ上の統計情報は同じ情報であり、 開発コスト低減のために可能であれば、集計表、グラフなどの画面表示用コンポーネントを流用して帳票をレイアウトしたい状況です。 方式検討 実現方式は以下のように複数考えられますが、 最終的には「ブラウザの印刷機能でPDF保存」させる方法を採用しました。 サーバサイドでPDFファイルを生成 テンプレートPDFを元
