この記事では、Excel/PDF出力として一番シンプルな形である、詳細画面からのPDF出力を行います。
※Excel出力も同じ要領で行う事ができます。
今回作成するカスタマイズの例
一番シンプルな形である、アプリの詳細画面からの出力を例にとって説明していきます。
今回は「見積書」アプリに登録しているレコード情報を元に、詳細画面に設置したボタンを押下した時にPDFファイルを出力します。
弊社サポートサイトにて配布しております、「sample_御見積書テンプレート」を使って出力を行っていただきますと、以下のような形で出力されます。
Excel/PDF出力するカスタマイズの大きな流れ
カスタマイズを始める前に、まずはカスタマイズがどの様な処理の流れになるか確認しておきましょう。
Excel/PDF 出力対象のレコードを取得
条件に一致するレコードを出力対象にしたい場合や一覧画面にチェックボックスを追加して選択したレコードのみを出力したい場合など、Excel/PDF出力の際には出力対象とするレコードを取得する処理が必要になります。
テンプレートファイルを取得
出力に使用するテンプレートファイルが保存されているレコードを、テンプレート管理アプリから取得します。
Excel/PDF を出力
取得したテンプレートファイルの設定内容に基づいて出力処理を行います。
(必要に応じて)Excel/PDF ファイルの出力先に伴う処理
生成したファイルは出力先を「ダウンロード」(即座にダウンロードする)・「添付ファイルフィールド」(kintone の添付ファイルフィールドに添付する)・「ブラウザのタブ」(タブにすぐ表示する ※PDFの場合のみ選べる)などから、出力先を選択することができます。
また、出力したファイルをレコードに添付したい場合には、例えばやること「レコードを更新する（キーの値をフィールドで指定）」などで、添付ファイルフィールドに出力したファイルをセットできます。
アプリの準備
３つ、アプリが必要となりますので準備します。
アプリは自分で準備する事もできますが、次のページからアプリテンプレートをダウンロードして登録する事もできます。
カスタマインの歩き方 カスタマイズお試し用ファイルダウンロード
「商品リスト」アプリ
※フィールド名とフィールドコードは同じものを指定
「見積書」アプリ
※フィールド名とフィールドコードは同じものを指定
※カスタマイズで利用するフィールドのみを記載
「出力テンプレート」アプリ
※フィールド名とフィールドコードは同じものを指定
テンプレートファイル
Excel/PDF出力をするカスタマイズについては、カスタマイズを作成する前に、テンプレートファイルを作成して、「出力テンプレート」アプリに登録を行います。
こちらについては、この記事の中で順に進めて作成していただくのが理解しやすくおすすめですが、次のページからテンプレートファイルをダウンロードして作成に代える事もできます（ただし、最終形のファイルのみ準備されています）。
カスタマインの歩き方 カスタマイズお試し用ファイルダウンロード
ファイル出力の際、固定となる文字、装飾、ページのレイアウトなどについては作成するテンプレートファイル（Excel）側で予め、見た目を調整した形で設定しておいてください。
今回の場合、「御見積書テンプレート」は事前に見た目を整えたものを使用しています。またこの際の注意事項として、テンプレートファイル内に関数が設定されている場合やセルの結合をしている場合、意図した通りにファイルが出力されない可能性があります。そのため実際に試される際には、まずは複雑な装飾をせずシンプルな形にて意図する内容が出力されるか確認された後に、見た目を整える手順としていただきますと、上手く行かない場合に原因を特定しやすく、修正もしやすいのでおすすめです。
また、テンプレートファイルで出力させたいフィールドの指定を行うには、フィールドコードとgusukuコマンドを利用します。このためフィールドの指定を行う前にフィールドコードを確認しておく必要があります。
まずは、「見積書」アプリのテーブル以外に設定されているフィールドコード（宛先、見積日、備考）を確認し、テンプレートファイルに設定してみましょう。
フィールド値をそのまま出力させる時は、下記のgusukuコマンドを使用します。
テンプレートファイルを作成する（前半）
「御見積書テンプレート」Excelファイルを下の画像の要領で作成し、赤い枠で囲まれているセルに対しフィールドコードとgusukuコマンドを入力します。
※gusukuコマンド入力の$や()は必ず半角で入力してください。
ここまでで、テーブル以外のフィールドを出力するためのテンプレートファイルは完成です。
テンプレートファイルを出力テンプレートアプリに設定する（前半）
このテンプレートファイルを「出力テンプレート」アプリに登録しておきます。
カスタマイズ作成
さて、ここからはPDF出力をするためのカスタマイズを作成します。
今回のカスタマイズは「見積書アプリ」に行います。
ここでは PDF を出力する想定ですが、ExcelやCSV出力の時は適宜読み替えて下さい。
まず、詳細画面表示の際にボタンを設置し、押下した際にやること「キーを指定してレコードを取得する」を使用して、先ほど作成した御見積書テンプレートを登録したレコードを取得しておきます。
PDF出力を行うために、やること「PDFを出力する」を使用します。この「やること」は取得したレコード情報をもとにPDF ファイルを生成・出力します。
※Excel出力の場合は「Excelを出力する」を用います。
この時、やることのパラメータ「gusuku APIキー」には以下の記事に沿って作成したgusuku APIキーを登録します。
また、パラメータ「データレコード」でレコードを選択しない場合は、表示されているレコードが出力対象になります。今回の場合はユーザーが開いている詳細画面の内容を出力するため、レコードを選択する必要はありません。
※レコードを選択して出力したい場合は、この「やること」を実行する前に、あらかじめレコードを取得しておくアクションが必要となります。
パラメータ「テンプレートレコード」では、テンプレートファイルを登録したアプリからレコードを取得したアクション番号を選択します。
この時に「テンプレートレコード」で選択するレコードは必ず事前に取得しておきます。もし取得できていない場合は、下記のように「テンプレートレコードがありません」というエラーが表示されます。この場合はアクショングラフを表示するなどしてアクションの順序を確認し、やること「PDFを出力する」が実行される前にテンプレートレコードの元となるレコードが正しく取得できているかを確認しましょう。
「ファイル名」には出力した日付やレコードのフィールド名、固定文字などが指定できます。
今回はファイル名を「= "御見積書_" & 見積番号」と指定しています。この設定の場合、出力レコードの見積番号が「20211202-01」と入力されているとファイル名は「御見積書_20211202-01.pdf」として出力されます。
以上でテーブル以外のカスタマイズは完成です。実行して試してみましょう。
テンプレートファイル状で指定したフィールド内容は、PDFに出力されたでしょうか？
もし、意図した通りに出力されない場合は、「sample_御見積書テンプレート」の記述を確認してみましょう。このテンプレートファイルを利用して、出力内容を確認するためには、「出力テンプレート」アプリに登録しているテンプレートファイルを変更して出力をお試しください。
テンプレートファイルを作成する（後半）
では次に、これまでの内容に加えてテーブルを含めたPDF出力を行なえるよう、テンプレートファイルを修正します。
先ほど使用した「御見積書テンプレート」のテーブル部分とその上部に「合計金額」〜「小計」のフィールドを、下記のgusukuコマンドを利用して設定してみましょう。
テーブル内のフィールドと合計金額を出力するために使用するgusukuコマンドは以下の通りです。
なお、$FOREACH(テーブルのフィールドコード)および $ENDを使用することでテーブルに登録されている行数分を繰り返して出力することができます。
テーブル内のフィールドタイプが数値以外のフィールドは、これまでと同様に$(フィールドコード)を使用して出力します。
御見積額は小計と同じ「計算」フィールドですので、$NUM(合計金額) の記述でも出力可能ですが、今回はExcelのSUM関数を使用して、出力してみましょう。
$FOREACH(フィールドコード) および $END で挟まれている行を計算させる場合は、$FOREACH(フィールドコード) および $END を記述した行も含めて範囲指定します。
テーブルの設定を反映したテンプレートファイルを「出力テンプレート」アプリのテンプレートファイルフィールドに登録します。
出力ファイルには登録されたテンプレートファイルの内容が反映されます。カスタマイズは先ほどと変わりありませんので、テーブルを含めた内容で出力されたかを確認してみてください。
もし、意図した通りに出力されない場合は、「sample_御見積書テンプレート」の設定を確認してみましょう。
出力したファイルを現在表示しているレコードに添付したい場合
先ほどのカスタマイズでは、やること「PDFを出力する」の出力先として「ダウンロード」を選択していましたが、生成したPDFファイルをレコードの添付ファイルフィールドに添付したいという場合には、追加でアクションが必要になります。
以下では、詳細画面でPDFファイルを出力した上で自身のレコードにある添付ファイルフィールドに先ほど出力したPDFファイルをセットするカスタマイズをご説明します。
「出力先」には「添付ファイルフィールド」を選択しておきます。この選択をすることで生成したPDFファイルはkintoneにアップロードされます。
※用途に応じて「ブラウザのタブと添付ファイルフィールド」や「ダウンロードと添付ファイルフィールド」などを使い分けてください。
しかし、kintoneにファイルをアップロードした時点では、ファイルはまだ実際に添付ファイルフィールドに保存されたわけではありません。
後続のアクションで「PDFを出力する」の結果を用いることで出力したPDFファイルを添付ファイルフィールドにセットすることができます。
今回はやること「レコードを更新する（キーの値をフィールドで指定）」を使用し、フィールドマッピングで添付ファイルフィールドに「=$4」(= $「PDFを出力する」のアクション番号)と指定して、PDFファイルを添付します。
詳細画面では、手動でブラウザの画面を更新するまでは最新の情報は表示されません。
よって、最後に出力されたファイルが添付されているか確認するためにやること「画面をリロードする」 を追加しておきます。
以上で出力したファイルを自身のレコードに添付するカスタマイズは完成です。
出力したファイルがレコードに添付されているか確認してみてください。
おわりに
この記事では、Excel/PDF出力として一番シンプルな形である、詳細画面からのPDF出力例をご説明しました。
ぜひExcel/PDF出力についても、色々と試してみてくださいね。
ご不明な点がございましたら、チャットでお問い合わせください。