logo

サイト内検索
ココログ最強検索 by 暴想

最近のトラックバック

無料ブログはココログ

« 2013年9月 | トップページ | 2014年1月 »

2013年11月

Reports Connect for Kintone ユーザー外字、IPAmjフォントの使用法

Reports Connect for Kintoneでは、ユーザー外字や、IPAで提供されているIPAmjフォントの一部を使用する事ができます。

まずは、ユーザー外字を使用してみましょう。

Windowsの外字エディターを使用して外字を作成します。
とりあえず、こんな感じのちょっと下手なスマイルマークの文字を作成しました↓。

Rc2dev1
作成した、外字はc:\Windows\fonts\EUDC.TTEに保存されます。
このファイルを、EUDC.ttfというファイル名に名前を変更してコピーします。
コピーの仕方は、コマンドプロンプトから以下のようなコマンドを入れて、任意のホルダーにコピーします。

   cp c:\Windows\Fonts\EUDC.TTE c:\work\EUDC.ttf

使い方は簡単。コピーしたファイルを帳票レコードに添付するだけで、この外字が使用できます。

20131115_15h15_23

前回までに作成した、見積もり書のレコードに添付しました。

さて、これで外字が本当に出力されるか試してみます。
商談のレコードに先ほど作った外字を入れてみましょう。

「説明」のフィールドの最後にIMEパッドを開いて、シフトJISの外字を選択すると、先ほど作った外字が出てきたので、これを選択。

20131115_15h44_18

外字が入力されました。

20131115_15h07_59

(外字は、ブラウザーで見る場合IEを使用しないと正しく見られないようです)

保存して、見積書を出力すると、

20131115_15h17_40 外字を表示できました。

次にIPAmjフォントを使用してみましょう。

IPAmjフォントは、人名などの表示用に作成された約6万字の漢字を収録したOpenTypeフォントで、IPAのダウンロードページから無料でダウンロードできます。

ReportsConnect for Salesforceでは、サーバー側にこのフォントを搭載しているためFont名を指定することで、これを使用する事ができます。

ただし、現段階では、約6万字すべてをサポートしている訳では無く、下記図の①②の範囲(サロゲートペアを含む)、約5万1千文字分が使用可能となっています。

20121220_17h23_13

まずは、IPAmjフォントをiReportで使用できるようにするために、あらかじめこちらのページからIPAmjフォントををダウンロードして自分のPCへインストールしておいてください。

今度は、ユーザー名にIPAmjフォントで出力可能なCJK互換漢字の文字を追加してみます。

IMEパッドを使用して、Unicode(基本多言語面)にある、「しんにゅう」の文字をいれてみました。

20131115_15h49_47

IPAmjフォントを使用するためにはiReportでのフォントの設定が必要です。

ReportInspectorでユーザーの該当ののフィールドを選択し、プロパティでFont関連の属性を変更します。IPAmjフォントを使用するには以下の4か所の属性を設定する必要があります。

Font name:  IPAmj明朝

PDF Font name:  Times-Roman

PDF Embeted:   true

PDF Encording:   Identity-H

以上の設定を行った上で、保存したjrxmlファイルを帳票レコードに添付して出力すると...

20131115_15h29_42 文字が出力されました。

このように、通常jasperreportsで使用されるiTextAsian.jarで使用可能な漢字以外にも、IPAmjフォントを使用する事で使える漢字の範囲を広げる事ができます。

なお、IPAmjフォントおよび外字は、サーバーからPDFファイルに組み込まれるため、PDFを見る側のユーザーの環境にIPAmjフォント、該当の外字が導入されている必要はありません。

追記:2013/12/25 同様の方法で、IPAexゴシック フォントが使用可能になりました。

Reports Connect for Kintone PDFファイルをレコードに添付する

Reports Connect for Kintone で、作成した帳票を、ダウンロードするのではなく、作成されたPDFファイルをレコードに添付する方法について解説します。

まず、添付先のフィールドをアプリに用意します。

20131115_14h05_42
次に、Reports Connectの帳票レコードの添付先フィールドに先ほど用意した添付先のフィールドコードを設定します。

20131115_14h03_17
この状態で、印刷を行うと、印刷のダウンロードと同時に、読み込んだレコードの添付先のフィールドにPDFファイルが添付されるようになります。

20131115_14h15_22_2
しかし、印刷処理は別画面で行われるので、もとの画面はリロードしないと添付されたファイルを確認できません。
そもそも、ファイルを添付するのが目的ならば、別画面を開いてPDFファイルをダウンロードする動きは必要ない場合が多いと思います。

その場合は、javascript上でkpsrc.gorcprint関数を呼び出す前に、以下のコードを入れてください。

   kpsrc.rcparms.kps_newwindow = false;

前回までのソースコードで言うと、goPrint関数を以下のようにします。

-------------------------------
    //④印刷ボタン押下時の処理。kpsrc.rcparms.kps_recidに現在のレコードIDを動的に設定し
    //kpsrc.gorcprint呼び出す
    function goPrint() {
        kpsrc.rcparms.kps_recid = kintone.app.record.getId();
        kpsrc.rcparms.kps_newwindow = false;  //別画面を開かない
        kpsrc.gorcprint();
    }
--------------------------------
この設定により、印刷ボタンを押すと別画面が開かなくなり、現画面の中で処理が行われ、自動的に添付したレコードの画面に遷移します。

なお、読み込んだ対象レコード以外に添付したい場合や、そもそもクエリーで複数レコードを読んでいる場合などは、添付先のレコードが特定できない場合などは、添付先のレコードを明示的に指定することができます。

その場合は、Reports Connectの帳票レコードの添付先フィールドを以下のように指定してください。

 アプリID;レコードID;フィールドコード

例:アプリID 19 のレコード番号 2のレコードの「添付ファイル」フィールドに添付したい場合は、先ほど「添付ファイル」とだけ指定した添付先フィールドを以下のように指定します。

  19;2;添付ファイル

なお、この値は、javascriptで、

  kpsrc.rcparms.kps_parentid

の値を設定すれば上書きされますので、javascriptのコードから動的に設定することができます。(特定の添付先レコードを固定する場合以外は普通そうすると思いますが)

また、アプリIDを省略して

  ;2;添付ファイル

の様に設定すると、現在のアプリIDが使用されます。

------追記---------

2015/10/01 認証をAPIトークンで行うことが可能になりました。

APIトークンによる認証を行う場合でレコードを添付するアプリが現在のアプリと異なる場合は、添付先フィールドの指定にさらに;添付するアプリのAPIトークンを連結してください。

 アプリID;レコードID;フィールドコード;添付するアプリのAPIトークン

の形式で入力します。
(APIトークンに「レコード編集」のアクセス権が必要)

Reports Connect for Kintone 画像の動的な設定

以前の記事で、Reports Connect for Kintoneで作成する帳票に必要な画像ファイルは、Reports Connectアプリの帳票レコードに添付して使用する、という説明をしました。
この方法は、会社のロゴ等、常に同じ画像を帳票上に表示するケースでは良いのですが、読み込むデータ上に帳票を持って、読んだデータによって帳票を変えたいケースでは、別の方法が使用できます。

前回使用した、見積書に表示しているロゴを、読み込む商談レコード上に添付してレコードに応じてそれが表示されるようにしてみます。

20131114_18h28_30
商談レコードに添付ファイルフィールドを追加して画像を添付出来るようにしました。

20131115_13h22_43
一方、Reports Connectの対応する帳票レコードには、「イメージファイルフィールド名」というフィールドがあります。
ここに、読み込むデータ上にあるイメージファイルを添付するフィールドのフィールドコードを指定します。

20131115_13h29_11
この指定により、Reports Connectは、データを読む際に、ここに指定したフィールドに添付されたファイルをサーバーに自動的にアップロードします。
kintoneではアップロードしたファイルには一意のfilekeyという、キー値が割り振られます。
自動的にアップロードされたファイルは、サーバー上のfilekey/ファイル名に保管されます。

次に、iReportを使ってjrxmlファイル側でこの画像ファイルを表示する設定を行います。

Reports Connectではファイルが添付されたレコードを読むと、ファイル添付のフィールドにはfilekey/ファイル名の文字列が返ります。
したがって、設定は簡単で、imageエレメントのプロパティ image Expressionに「$F{添付ファイル}」と設定するだけです。

20131115_13h39_32
ただし、このままだと、画像が添付されていないレコードを読んだ場合、エラーが出てしまうため、print when Expressionを以下のように設定してください。

 !$F{添付ファイル}.equals( "null" ) && !$F{添付ファイル}.equals( "" )

20131115_13h44_34
print when Expressionはこのエレメントを表示する条件を指定する項目で、この式により、フィールド添付ファイルの値が"null"か空文字の場合は表示しない設定になりますので、エラーが回避されます。

以上で、レコードに添付された画像を該当箇所に表示するようになりました。

20131115_13h52_32

なお、今回作成したjrxmlファイルはこちらからダウンロードできます。

estimatesd2.jrxml

-------追記 2015/10/07--------

データ側のアプリに複数のイメージファイルをアップロードすることで、複数のイメージを帳票に表示することが可能になりました。

複数のイメージファイルをアップロードすると、Reportsconnectには、ファイル添付のフィールドに filekey/ファイル名 の文字列が ; 区切りで返ります。

一方、サーバーにはそれぞれのファイルが filekey/ファイル名 に保管されますので、iReportでimageエレメントのプロパティ image Expression で $F{添付ファイル}の値を ; 区切りで区切って、欲しい画像のファイル名を取り出せば、選択的にイメージを表示出来ます。

例として、

 $F{添付ファイル}.split(";")[0]

と指定すれば、添付した最初のイメージが表示されます。

同様に、配列のインデックスを1とすれば( $F{添付ファイル}.split(";")[1] )2つ目に添付したイメージを表示できます。

なお、従来通り

 $F{添付ファイル}

とした場合は、最後に添付したイメージが表示されます。

 

Reports Connect for Kintone テーブルのデータの読込その2

前回Reports Connect for Kintone テーブルのデータの読込で、テーブルを含むデータの取り扱いについて解説しましたが、今回はテーブルのデータをサブリポートを使用して読み込む方法について解説します。

前回の方法よりも少々複雑ですが、この方法を用いれば、一つの帳票に複数のテーブルを含む帳票も作成可能になります。

今回のReports Connectの帳票レコードの設定は以下のとおりです。

20131114_17h35_34
前回と異なるのは、「テーブル」への設定が無い事と、親JRXMLファイル名に指定がある事です。
親JRXMLファイル名に関してはのちほど、解説しますので、とりあえずは、データのアプリIDと対象レコード番号、ログイン、パスワードを設定した状態でデータの確認のボタンを押します。

すると、今回は2つのFile CSV Datasourceが出力されます。

20131114_17h45_21

上のDatasourceがヘッダー部分、下がテーブル部分だという事がわかります。

これらを使用して、親と子の2つの帳票を作成し、親の帳票の一部に子の帳票をsubreportとして組み込む形で1枚の帳票デザインを組み立てます。

それでははじめに、下のテーブル部分のCSVDatasourceを使用して明細部分の帳票をiReportで作成する事にしましょう。

これは、前回の帳票の明細部分のみを抜き出した(PageHeaderやPageFotter等のバンドが無い)帳票として作ります。

20131114_17h52_23

次に、親の帳票を作成します。

こちらは、逆に、前回の帳票の明細部分を取り除いたものを作ります。

CSVから作成されたFieldのうち「明細」はサブクエリーからのコレクションオブジェクトが返るFieldです。そこで、このFieldのプロパティField Classを、java.lang.Objectに変更します。

20131114_16h52_20

次に、明細の入るスペースを作ります。明細部分のColumn headerとColumn footerを削除してdetailのバンドを最大限縦に広げます。

20131114_18h04_13

できたdetailのスペースにパレットのウィンドウからSubreportをドラッグアンドドロップします。

20131114_18h08_47

すると、Subreport Wizardのダイアログが開きます。

WizardのStep1では、Use an existing reportをチェックして先ほど作成したContactsのjrxmlファイルを指定します。

20131114_16h53_49

Step2ではUse a JRDatasource Expressionを選択し、横のボタンを押します。

Rc3dev06

Expression Editorが開きますので、ここに以下のような記述を設定してください。

$F{明細}!=null&&!$F{明細}.equals("null")?new JRBeanCollectionDataSource((Collection)$F{明細}):null

20131114_16h56_43
これは、ContactsのFieldに返ってくるContactオブジェクトのコレクションを、このサブリポートがDatasourceとして使用するための指定です。コレクションの中身が空の時はサブリポートに空値を与えます。
Applyを押して保存します。

この先のStep3、Step4は次へを押してとりあえずWizardを終了します。

できたSubreportは大きさを広げてDetailのいっぱいを占める大きさに調整します。

20131114_17h24_39

サブリポート側のデザインが横幅全体を前提としているので、サブリポートの横幅はページいっぱいまで広げておきます。

次に、先ほど指定した、JRBeanCollectionDataSourceを参照できるように、Importsの指定を行います。

リポートのプロパティのImportsの横のボタンを押して設定を追加します。

20131114_17h13_32

開いたダイアログのAddボタンを押して、以下のパッケージを設定してください。

net.sf.jasperreports.engine.data.*

 

次に、Subreportのjrxmlファイルの指定を変更します。SubreportのプロパティのSubreport Expressionの横のボタンを押してExpression Editorを開きます。

開いた状態では、個々の記述は以下のようになっていると思います。

 $P{SUBREPORT_DIR} + "estimatesdms.jasper"

estimatesdmsの部分はサブリポートに付けた名前です。

ここの、$P{SUBREPORT_DIR} + の部分を消します。

20131114_18h24_06

Reports ConnectではSubreportは親のReportと同じフォルダーに保存されるため、上記のような設定にする必要があります。

了解を押して保存します。

これで、Report accountsができました、この段階で、Previewを押して結果を確認したいところですがPreviewは

  Unable to get value for field '明細' of class 'java.util.Collection'

というエラーになってしまします。

これは、Files CSV Datasourceでは入れ子になったCollectionの構造を表現できないためです。

では、実際に出来上がったjrxmlファイルをReports Connectの帳票レコードに添付して印刷してみましょう。

出来上がった2つのjrxmlファイルを帳票に添付します。

Subreportを使用する場合は、親のjrxmlファイルの名前を「親JRXMLファイル名」に指定してください。

印刷テストボタンを押すと帳票が出力されました。

20131114_18h28_30

今回はテーブルの数はひとつでしたが、この方法を使えば、1枚の帳票に複数のテーブルを表示するような複合的な帳票を作成することができます。

なお、今回作成したjrxmlファイルはこちらからダウンロードできます。

estimatesdms.jrxml

oyaestimate.jrxml

Reports Connect for Kintone テーブルのデータの読込

kintoneでは、ヘッダー明細型の伝票のような形式を表現する方法として、テーブルという機能があります。
今回は、テーブルを使用した場合にそのデータをReports Connectで使用する方法について解説します。

まず、対象となるアプリとして以下のようなアプリを作成しました。

20131209_15h56_03
合計金額、金額は「計算」型を使用しています。下部にテーブルを設定しています。テーブルのフィールドコードには「明細」という名前を付けました。

20131114_15h23_05

実際にデータを入れたものが、以下です。

20131114_15h02_49

すでに印刷用のボタンが組み込まれていますが、この組み込み方法は後ほど解説します。

次に、Reports Connectアプリに対応する帳票レコードを作成します。

20131114_15h05_25_2
テーブルを使用する場合は、「テーブル」というフィールドに出力するテーブルのフィールドコードを指定します。
なお、「テーブル」には、テーブルを読む際のソート順をorder byで指定する事も可能です。
対象のレコード番号をとりあえず先ほど入力したレコードに設定していますが、これはアプリ組み込み後はJavascriptで現在開いているレコードの番号で上書きします。
添付ファイルにはjrxmlファイルと帳票で使用するイメージを添付しています。

データの確認ボタンを押してCSVDatasourceをダウンロードすると、以下のようなデータが出力されます。

20131114_15h32_09

帳票レコードの「テーブル」を設定した場合は、1件の元レコードに対して、テーブルの件数分のデータが作成されます。この場合は3件作成されました。

内容は、テーブル各行のデータおよびヘッダーの内容が連結されます。

SQLで言うと、ヘッダーと明細をouter joinしたイメージになります。

ちなみに、「テーブル」を設定しなかった場合は、テーブルのデータはsubクエリーを発行したようなデータ構造となって出力されます。

このケースはiReportのsubreportを使用して帳票を作成することになりますが、その方法は少々複雑なので、別途解説します

iRepotでのjrxmlファイル作成は以下のように、見積書が印刷されるようにしました。

20131114_15h40_06

さて、アプリへの組み込みには、以下の様なJavascriptを使用します。

なお、Reports Connect for Kintoneのアプリへの組み込み方法については、Reports Connect for Kintone アプリへの組込み方法を参照してください。

-------------------------------------

/*
* 商談 見積もり印刷
*/
(function() {

    //①ReportsConnectのライブラリーをロードする
    load("https://kps-reportsconnectk.herokuapp.com/js/kpsrck.js");
    //②ロード完了後kpsrc.setupReportを呼び出す
    waitLoaded(function(){
        kpsrc.setupReport(17, "商談見積もり");
    });
    //③詳細表示時に、印刷ボタンを追加する(bt1はボタン配置スペースの要素ID)
    kintone.events.on('app.record.detail.show', function(event) {
            var bt = document.createElement('input');
            bt.type = "button";
            bt.value = "見積印刷";
            bt.onclick = goPrint;
            var btsp = kintone.app.record.getSpaceElement("bt1");
            btsp.appendChild(bt);
        });
    //④印刷ボタン押下時の処理。kpsrc.rcparms.kps_recidに現在のレコードIDを動的に設定し
    //kpsrc.gorcprint呼び出す
    function goPrint() {
        kpsrc.rcparms.kps_recid = kintone.app.record.getId();
        kpsrc.gorcprint();
    }
    //以下の関数はそのままコピペしてください。
    // http ヘッダに要素を追加します
    function load(src) {
        var head = document.getElementsByTagName('head')[0];
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = src;
        head.appendChild(script);
    }
    // ReportsConnect がロードされるまで待ちます
    var timeout = 10 * 1000; // ms
    var interval = 100; // ms
    function waitLoaded(callback,parm) {
        setTimeout(function() {
            timeout -= interval;
            if (typeof kpsrc !== 'undefined') {
                callback(parm);
            } else if (timeout > 0) {
                waitLoaded(callback,parm);
            } else {
                // abort
            }
        }, interval);
    }
})();

---------------------------------------------------

Reports Connect for Kintone アプリへの組込み方法で解説したケースと違うのは、こちらは詳細画面にボタンを設置するので、kintone.app.record.getFieldElement関数で、フィールドのエレメントを取って、その下にボタンを設置している点と、印刷ボタン押下時にkpsrc.rcparms.kps_recidに現在のレコード番号を設定している点です。

で、実際にアプリでレコードを選んで詳細画面からボタンを押すと、以下のように見積もり書が出力できました。

20131114_15h51_43

なお、今回作成したjrxmlファイルはこちらからダウンロードできます。

estimatesd.jrxml

Reports Connect for Kintone アプリへの組込み方法

前回までの記事で、Reports Connect for Kintoneでの帳票開発方法に関して解説しました。

今回は、出来上がった帳票を、実際のアプリに組込むテクニックに関して解説します。

前回対象とした「はじめに」というアプリの一覧画面に印刷ボタンを追加して、表示している一覧の内容をReports Connectで印刷出来るようにします。

ボタンの追加は、以下のJavascriptをアプリにアップロードすることで実現できます。

------------------------------

/*
* はじめに一覧印刷
*/
(function() {

    //①ReportsConnectのライブラリーをロードする
    load("https://kps-reportsconnectk.herokuapp.com/js/kpsrck.js");
    //②ロード完了後kpsrc.setupReportを呼び出す
    //(引数はReportsConnectのアプリIDと帳票レコード名)
    waitLoaded(function(){
        kpsrc.setupReport(17, "はじめに一覧");
    });
    //③一覧表示時に、印刷ボタンが無ければ追加する
    kintone.events.on('app.record.index.show', function(event) {
        var btid = "printbt";
        if(document.getElementById(btid)==null){
            var sp = kintone.app.getHeaderMenuSpaceElement();
            var bt = document.createElement('input');
            bt.type = "button";
            bt.value = "印刷";
            bt.onclick = goPrint;
            bt.id = btid;
            sp.appendChild(bt);
        }
    });
    //④印刷ボタン押下時の処理。kpsrc.rcparms.kps_qlにクエリーを動的に設定し
    //kpsrc.gorcprint呼び出す
    function goPrint() {
        kpsrc.rcparms.kps_ql = kintone.app.getQueryCondition() + " order by 優先度";
        kpsrc.gorcprint();
    }
    //以下の関数はそのままコピペしてください。
    // http ヘッダに要素を追加します
    function load(src) {
        var head = document.getElementsByTagName('head')[0];
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = src;
        head.appendChild(script);
    }
    // ReportsConnect がロードされるまで待ちます
    var timeout = 10 * 1000; // ms
    var interval = 100; // ms
    function waitLoaded(callback,parm) {
        setTimeout(function() {
            timeout -= interval;
            if (typeof kpsrc !== 'undefined') {
                callback(parm);
            } else if (timeout > 0) {
                waitLoaded(callback,parm);
            } else {
                // abort
            }
        }, interval);
    }

})();

----------------------------

*コードの解説

順を追って上記コードの解説をします。

①ReportsConnectのライブラリーをロードする

load関数を呼び出します。

②ロード完了後kpsrc.setupReportを呼び出す

setupReportは印刷処理の初期設定を行う関数です。引数にReportsConnectのアプリIDと帳票レコード名を指定します。

この関数は①でロードするReportsConnectのライブラリーのロードが完了後実行する必要があります。waitLoaded関数の中に記述することで、ライブラリーのロード完了後実行されます。

③一覧表示時に、印刷ボタンが無ければ追加する

app.record.index.showイベントに処理を記述することで、一覧表示時に実行する処理を記述できます。

kintone.app.getHeaderMenuSpaceElement関数で、一覧の上の部分のスペースの要素を取得することができるので、ここにボタンを追加します。

ボタン押下時の処理は④で記述するgoPrint関数を指定します。

④印刷ボタン押下時の処理

kpsrc.rcparms.kps_qlにクエリーを設定すると、対応する帳票レコードのクエリーフィールドに指定したクエリーを上書きできます。

これにより、読み込むデータの条件を動的に変更できます。

今回は、kintone.app.getQueryCondition関数により、現在表示している一覧の条件に対応するクエリーを入手し、指定します。

さらに帳票のグルーピングで優先度を指定している都合上、" order by 優先度"を連結しておきます。

なお、kps_qlと同様に、以下のパラメーター名(kpsrc.rcparms.xxxxxのxxxxxの部分)に値を設定することで帳票レコードの設定を動的に上書きできます。

帳票レコードのフィールドパラメーター名意味備考
クエリー kps_ql データを読む際のクエリー
データのアプリID kps_dataappid 対象アプリID
対象レコード番号 kps_recid 読み込むレコードID クエリーと対象レコード番号はどちらか一方を指定する
テーブル kps_table 使用するテーブルのフィールドコード テーブルのデータを読む場合指定
ファイル名 kps_filename PDFファイルの名前 defaultはprint.pdf
添付先 kps_parentid PDFファイルをレコードに添付する場合の添付先 アプリID;レコードID;フィールドコードで指定、フィールドコードのみを指定した場合は現在のレコードに添付される
APIトークンによる認証を行う場合でレコードを添付するアプリが現在のアプリと異なる場合は、添付先フィールドの指定にさらに;添付するアプリのAPIトークンを連結してください。
イメージファイルフィールド名 kps_upattach 帳票で使用したいイメージがデータに添付されている場合のフィールドコード
nullを空文字へ置換 kps_null2blank 値がnullの場合、"null"という文字列の代わりに空文字を設定するかどうか
ログイン kps_login データをアクセスするユーザーのログイン名 APIトークンでの認証を行う場合はReportsconnectアプリのトークン,データのアプリのトークンの順にカンマ区切りで指定
パスワード kps_pwd データをアクセスするユーザーのパスワード APIトークンでの認証を行う場合はブランク
n/a kps_newwindow 印刷時に別Windowを開くかどうか PDF添付処理の際に使用する。boolean値で指定

なお、その下にあるload関数とwaitLoaded関数はライブラリーのロードと、ロード完了を待つ関数です。ここに記述されているものをそのまま使用してください。

*Javascriptのアップロードと実行

以上のJavascriptをアプリの管理->詳細設定->Javascriptによるカスタマイズ のリンクからアップロードしてやると、一覧画面に印刷ボタンが表示されます。

20131114_13h43_47

印刷ボタンを押すと表示中の条件で選択されたデータで前回作成した帳票が印刷できます。

20131114_13h52_31

ただし、一覧のセレクトリストで、My toDoを選択したケースではエラーが発生しました。

20131114_13h47_53

サイボウズに確認したところ、これは、kintone.app.getQueryConditionで入手したクエリーではステータスというフィールドに指定する条件が「完了」等の文字でなく、内部コードが指定されるという問題があるためだそうです。

今後修正するかどうかは、今後のバージョンアップ時、検討するそうです。

今のところ、条件にステータスを使用する場合は自力で内部コードを対応する文字列に変換する等の工夫が必要なようです。

*パラメータを帳票へ表示

なお、Javascriptでkpsrc.rcparms.xxxxxに指定した値は、iReport側にパラメータとして渡されますので、これを使用する事ができます。xxxxxの部分がパラメーター名になります。

試しに、今回発行したクエリーを帳票のタイトル部分に出力してみます。

iReportで、前回作成した、Users.jrxmlを再度開いて、レイアウトを修正します。

まずは、画面左のReport Inspectorから、Titleの下にあるCherry TitleとCherry Subtitleを選択して、右クリックして削除します。

択して、右クリックして削除します。

Rcdev5
次に、上がって来たパラメーターを表示できるように、Parameterを追加します。
Report InspectorからParametersを右クリックして追加します。

Rcdev6

追加したパラメータのName属性をパラメーター名「kps_ql」に変更するのを忘れないように。

次に、先ほど削除したTitleの場所に表示エリアを設けます。
まずは、ラベルとしてパレットのウインドウからStatic TextをTitleの位置にドラッグアンドドロップします。

20131114_14h03_45

初期状態ではStatic Textの文字の色が黒で、バックの色と重なって文字が見えないので、Static TextのプロパティからForecolorを白に変更しましょう。

Rcdev72
Static TextのTextプロパティを「Condition:」としておきます。

次に、先ほど追加したパラメーターを「Condition:」の横に設置します。

20131114_14h11_05

こちらのForecolorも白に変更しておきます。

20131114_14h13_29

これで修正完了。jrxmlファイルを保存して、帳票レコードに添付してあるjrxmlファイルを新しいものに入れ替えます。

これで、印刷ボタンを押すと。

20131114_14h18_42

タイトルのところに、conditionに渡した文字列が表示されて、ユーザータイプStandardのユーザーのみ表示されるようになりました。

このように、Javascriptからkpsrc.rcparms.xxxxxに文字列を乗せれば、帳票の任意の場所にそれを表示することができます。

今回は、一覧表をの印刷ボタンを組み込む方法を解説しましたが、単票印刷の場合は次の記事を参照してください

これでKintoneでの帳票開発も楽々しかも無料 Reports Connect for Kintoneその3

これでKintoneでの帳票開発も楽々しかも無料 Reports Connect for Kintoneその2の続きです。

前回の記事で、帳票レイアウトファイルUsers.jrxmlが出来上がったので、これをReportsConnectの帳票に取り込みます。

やり方は簡単。ReportsConnectアプリの帳票レコード画面から、該当の帳票レコードにファイル添付するだけ。

20131112_15h22_39
こんな感じで、添付できました。

20131112_15h23_57
では、印刷してみましょう、印刷テストボタンを押します。

20131112_17h21_55
あれ~。こけた。例外が発生している模様。

20131112_17h23_43
こういう場合は、データの確認の方のボタンを押すと原因が分かりやすい。

20131112_16h16_55_2
なに、なに、例外が発生しています...
恐らくReport上で使用している画像ファイル等が帳票オブジェクトに添付されていません。 ...と。 親切にも問題解決のヒントを教えてくれます

20131112_17h27_48
どうやらcherry.jpgファイルが必要なようだ。
帳票のヘッダーに使われているチェリーの絵だね。jrxmlを出力したフォルダーを見ると、同じフォルダーにcherry.jpgも出力されている。
このファイルも添付してやる。

20131112_15h26_06

チェリーの絵をアップロードして、再度データの確認を押すと、今度は例外が出ていないようなので、テスト印刷を押します。
すると、処理中のウィンドウからダウンロードのダイアログが出ました。

なお、私はFirefoxを使用していますが、他のブラウザーの場合はダウンロードの出方が違うと思います。

20131112_15h27_15

プログラムで開く でAdbe Readerで開けば...

20131112_15h29_38

おー、PDFの帳票がちゃんと出来上がりました。すごい!立派!

なお、IEの場合でダウンロードがうまくいかない場合は、以下のページあたりを参考にしてください。

IE でファイルのダウンロードができないときのトラブルシューティング

以上が、ReportsConnectを使用した帳票開発方法のご紹介。
SOQLさえ書けば、コードを一切書かずに帳票ができました。

さて、次回は、完成した帳票を自前のアプリケーションから出力する方法を解説します。

これでKintoneでの帳票開発も楽々しかも無料 Reports Connect for Kintone その2

これでKintoneでの帳票開発も楽々しかも無料 Reports Connect for Kintone」の続きです。

前回の記事で、Kitone上のReportsConnectのアプリからiReportのDataSourceを出力できました。
今回はそのDataSourceをiReportから取り込むところから始めます。

それでは、iReportを起動します。

iReportの初期画面の上の方に、DataSourceのボタンがあります。

Ireportdataspource

これを押すとDataSourceの管理を行うダイアログが現れます。
このダイアログのNewボタンを押して新規のDataSourceを作成します。

Irpds1
次画面で、DataSourceのTypeとして、「File CSV datasource」を選んでNextを押します。

Irpds2
次画面で、前回ダウンロードしたCSVファイルを選択します。
ここではDataSourceにUsersという名前を付けました。
CSVファイルを選択したら、Get coumns name...のボタンを押すと...

Ws000001

カラムが登録されました。
これは、前回帳票レコードに登録した、データのアプリIDで参照されるアプリのフィールドコード対応しているのがわかります。
SaveボタンでDataSourceを保存すると、DataSourceボタンの横のselectに今保存したUsersというDataSourceが追加されます。

Irpds5
次に、実際の帳票のレイアウトの作成を行います。

メニューのファイルから、New...を選択します。

Irpds
New fileのダイアログが開き、iReportが提供するReportのテンプレートがいくつか表示されています。

Irpds6
もちろん、白紙から帳票デザインを始めることもできますが、テンプレートを使用することで、ウイザード形式で、帳票デザインを簡単に行うことができます。
この中から今回は、Cherry Landscapeというテンプレートを使ってみましょう。

テンプレートを選択したら、Lauch Report Wizardボタンを押します。

ウイザードのステップ2は、帳票レイアウトファイルの名前と保存場所を指定。
ファイルの拡張子はjrxmlとなります。

20131112_17h17_16

jrxmlファイルの名前はUsers.jrxmlとしました。

ステップ3はDataSourceの選択。先ほど作ったUsersを選択します。

Irpds8

ステップ4はFieldの選択。DataSourceのカラムから帳票で使用するFieldを選択します。

20131112_14h14_12

ステップ5は帳票のグルーピングの設定。

優先度でグルーピングします。

なお、グルーピングする場合は、グルーピングするカラムでデータがソートされている必要があります。

今回は、ちゃんとクエリーにorder by 優先度としてあるのでOK.

20131112_14h24_16

指定は以上で終わり。完了ボタンを押せば、帳票レイアウトの出来上がり。

簡単だね。

Irpds11

出来上がった帳票レイアウトです。

あれ?なんだか漢字の部分がちゃんと出てないようだな...

20131112_14h26_25

iReport付属のテンプレートは、Filedの属性に漢字出力可能なフォントが指定されていないのが原因です。

グループヘッダーに表示されるプロファイル名のFieldのフォントの設定を変更します。

画面左のRepot InspectorでGroup Header1をクリックしてその配下のFieldを選択します。

すると、画面右のプロパティのウインドウでFieldの属性を設定可能となります。

そこで、以下のように設定しました。

Font name : MS明朝

PDF Font name : HeiseiMin-W3

PDF Encoding : UniJIS-UCS2-H

漢字を出す、他のFieldにも同様の設定をします。

20131112_14h32_25

なお、ReportsConnectサーバーは日本語フォントを出力するために、iTextAsian.jarを使用しています。このライブラリーで漢字を出力する場合の有効なPDF Font nameは

HeiseiKakuGo-W5 (ゴシック)

HeiseiMin-W3  (明朝)

また、PDF Encodingは

UniJIS-UCS2-H (横書き用)

UniJIS-UCS2-V (縦書き用)

となります。

Previewボタンを押してイメージを見てみましょう。

20131112_15h21_22

CSVデータソースのデータを使用して、実際の出力画面をPreviewできます。

なお、カラムのヘッダーは、データのアプリのフィールドコードがそのまま使われているので、これを変更したければ、該当のStatic Textを選択して修正すればOKです。

その他、修正したいところは、iRepotの機能を使用して行えます。今回は、とりあえずこのまま先に進みます。

さて、これで、帳票レイアウトができたようなので、出力されたjrxmlファイルを帳票レコードに登録します。

なお、今回作成したjrxmlファイルはこちらからダウンロードできます。

Users.jrxml

それに関しては、さらに続き、これでKintoneでの帳票開発も楽々しかも無料 Reports Connect for Kintoneその3をご覧ください。

これでKintoneでの帳票開発も楽々しかも無料 Reports Connect for Kintone

ご好評いただいております、ReportsConnect for Salesforceに続きまして、サイボウズ(株)より提供されているクラウドプラットフォーム Kintoneの環境での帳票ツールReportsConnect for Kintoneが公開されました。

ReportsConnect for Kintoneはこちらからダウンロードできます。

なお、ダウンロードされるファイルはアプリテンプレート形式です。アプリテンプレートのお客様環境への読込方法は以下を参考にしてください。
https://help.cybozu.com/ja/k/admin/import_template.html

今回は、ReportsConnect for Kintoneによる帳票開発手順について解説します。

このReports Connectですが、帳票作成のエンジンは、オープンソースのJasperreportsを使用しています。
実は、Jasperreportsをherokuの上で動かして帳票を出してくれるのです。もっとも、使う側はherokuの事なんかは意識する必要は無いけどね。

Jasperreportsを使用しているので、帳票デザインツールはiReportを使用することになります。

iReportはこちらのページから5.2.0をダウンロードしてください。

さて、今回はKintoneの環境にあらかじめ入っている、「はじめに」というtoDo情報を扱うアプリケーションのデータから、ReportsConnect for Kintoneで一覧表を作成してみる事にします。

20131112_15h47_12

帳票の開発に入る前に、「はじめに」のアプリ側の設定を少々変更します。

歯車アイコン->このアプリの設定->フォームの設定 とクリックして、各フィールドのフィールドコードをわかりやすいものに変更しておきます。

20131112_11h42_54

フィールドコードは、ReportsConnectからフィールドを参照する名前になりますので、すべてのフィールドに関してとりあえず、フィールド名と同じにしておきましょう。

あと、このアプリのアプリIDを参照しますので、確認しておきます。

アプリIDはURL/k/の後にある数字になります。

20131112_11h46_24

ReportsConnect for Kintoneをインストールしたら、ロゴをクリックして一覧画面を開きます。

まず、一覧画面の左上の+ボタンを押して、帳票のレコードを作成します。

20131112_15h40_49

作成する帳票レコードには以下のように設定します。

帳票名:「はじめに一覧」 (これはなんでも良いのですが)

クエリー:データの絞り込みや、順序を指定する、今回は優先度でグルーピングする都合上、優先度順にする

データのアプリID:使用するデータもとのアプリIDを指定

ログイン/パスワード:データをアクセスする権限を持ったユーザーのログイン/パスワードを指定する

------追記---------

2015/10/01 認証をAPIトークンで行うことが可能になりました。

ログイン/パスワードを帳票アプリに指定する必要が無くなります。

APIトークンでの認証を行う場合はログイン欄にReportsconnectアプリのトークン,データのアプリのトークンの順にカンマ区切りで指定し、パスワード欄はブランクにします。

例:Reportsconnectアプリのトークン,データのアプリのトークンがそれぞれxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx,yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyの場合、ログイン欄に以下のように指定する。

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx,yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

(APIトークンのアクセス権は「レコード閲覧」が必要。PDFをデータのアプリに添付する場合は、それに加えてデータのアプリのトークンに「レコード編集」が必要)

20131112_14h22_01

なお、クエリーに指定可能な設定に関しては、こちらを参照してください。

このレコードを保存したら、まずは、iReportにインポートするDataSourceの作成を行います。

やり方は、ただ、データの確認ボタンを押すだけ。

20131112_16h16_55

あれ、ポップアップがロックされたというメッセージが出ました。

(私はfirefoxを使用しています、他のブラウザーのメッセージは多少違うかも)

20131112_16h19_02

設定ボタンを押して、このサイトによるポップアップを許可するをクリックします。

Ws000002

再度、データの確認ボタンを押すと、別ウインドが立ち上がります。

印刷処理中の画面になり、その後データの確認画面が現れます。

20131112_16h34_52

データの確認画面には、発行されたクエリー、CSVデータソース、読み込んだデータの構造(先頭10件まで)、送られたリクエストパラメーターといった情報が表示されています。

この中で、iReportにインポートする、CSVファイルデータソースをダウンロードすることができます。

CSVファイルデータソースのダウンロードボタンを押してCSVファイルをダウンロードします。

ダウンロードしたファイルは、この後iReportで使用しますので、どこに落としたかちゃんと確認しておいてください。

さて、この後は、iReportでの帳票作成作業になりますが、そちらは、続き「これでSalesforceでの帳票開発も楽々しかも無料 Reports Connect for Kintone その2」をご覧ください。

なお、iReportは、帳票作成の分野では有名なオープンソースプロダクトですので、ネット上に沢山情報があります。そちらも参考にしてください。

« 2013年9月 | トップページ | 2014年1月 »