logo

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

最近のトラックバック

無料ブログはココログ

« 2011年9月 | トップページ | 2012年12月 »

2012年11月

Reports Connect for Salesforce ダウンロード画面のカスタマイズ

Reports Connect for Salesforceでは、PDFダウンロード時に別Windowが開いて、このような画面が出ます。

Rc4dev01
この画面をカスタマイズすることができます。

自分のアプリケーションの名前を出すなど、アプリに応じて自由なデザインの画面にすることができます。

カスタマイズ可能な画面は以下の3種類です。

ダウンロード時の画面:dl.html
上記画面

印刷エラー時の画面:dlErr.html

Rc4dev02
印刷対象なしの画面:dlNodata.html

Rc4dev03
以上の3つのjspのオリジナルのソースコードは、以下のリンクからダウンロード可能です。

カスタマイズ方法は実に簡単です。上記jspファイルを参考に、カスタマイズしたhtmlファイルをjrxml等のファイルと同様に、帳票レコードに添付するだけです。

実際にカスタマイズができるか、やってみましょう。

上記リンクからダウンロードしたdl.jspのソースコードは以下のとおりです。

-------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="image/x-icon" rel="shortcut icon"
    href="http://techsupport.kpscorp.jp/templates/newkokyakuroku/favicon.ico">
<link rel="stylesheet" type="text/css"
    href="${baseUrl}/resources/common.css">
<link rel="stylesheet" type="text/css"
    href="${baseUrl}/resources/extended.css">
<link rel="stylesheet" type="text/css"
    href="${baseUrl}/resources/elements.css">
<link rel="stylesheet" type="text/css"
    href="${baseUrl}/resources/security_page.css">
<style type="text/css">
#main-logo {
    display: block;
    font-size: 30pt;
    height: 80px;
    overflow: hidden;
    position: absolute;
    width: 300px;
    z-index: 12;
    margin-top: 0px;
    padding-top: 20px;
    padding-left: 10px;
    color: Snow;
}
</style>
<title>ダウンロードページ</title>
</head>
<body>
    <div id="pagewrap">
        <a id="main-logo"
            href="http://techsupport.kpscorp.jp/reportsconnect.html">ReportsConnect</a>
        <div id="headerwrap">
            <div id="header">
                <div id="headertext">KPSの印刷ソリューション</div>
                <!-- .header-text-->
            </div>
        </div>
        <!-- .headerwrap -->
        <div id="contentwrap">
            <div class="oauthcontent" id="oauthcontent" style="height: 259px;">
                <div id="client_details" style="padding-top: 50px;">
                    <img
                        src="${baseUrl}/resources/ReportsConnect.png">
                    <div id="client_description">印刷サーバーにPDFファイルの作成を要求しました。</div>
                </div>
                <div class="arrow"></div>
                <div id="perms_wrap" style="padding-top: 60px;">
                    <h2 id="shorih">ただ今処理中...</h2>
                    <div class="oauth_text bullets">
                        PDFファイルのダウンロードが始まるまで、少々お待ちください。</div>
                    <div class="oauth_text">
                        ダウンロード完了後、このウインドウを閉じてください。</div>
                    <div id="acceptdeny">
                        <input type="button" title="閉じる" class="btnPrimary btn allowBtn"
                            value=" 閉じる " onClick="window.close();"">
                    </div>
                </div>
            </div>
            &nbsp;
        </div>
        <!-- #footer -->
    </div>
    <script type="text/javascript">
        function addLoadEvent(func) {
            var oldonload = window.onload;
            if (typeof window.onload != 'function') {
                window.onload = func;
            } else {
                window.onload = function() {
                    oldonload();
                    func();
                }
            }
        }
        function doDl() {
            location.href = "dl2?state=${key}";
        }

        if ("${key}" != "") {
            //location.href = "dl?state=${key}";
            addLoadEvent(doDl);
        }
    </script>

</body>
</html>

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

このソースには、JSP風の変数が使用できます。

使用出来る変数は以下の通り。

{!baseUrl}    サーバーのコンテキストのURL

{!erroe}      エラー名

{!error_description}   エラー記述

{!key}      PDFダウンロード時に指定する

このソースは、一見JSP風にも見えますが、JSPではありません。JSPをカスタマイズに使用する事は、セキュリティー上の理由からできません。

この画面の左上のReportsConnectの文字を変えてみます

        <a id="main-logo"
            href="http://techsupport.kpscorp.jp/reportsconnect.html">ReportsConnect</a>

      ↓

        <a id="main-logo"
            href="http://techsupport.kpscorp.jp/reportsconnect.html">カスタマイズ済み</a>

修正したソースを帳票レコードに添付します。

20121218_13h36_09

これで、印刷してみると...

おー、見事に変わりました。

Rc4dev05

同様に他の2つのhtmlに関しても添付するだけで修正が可能です。

なお、すべての帳票にカスタマイズ画面を適用したい場合は、「管理レコード」のチェックをつけた帳票レコードを1件用意して、そちらに添付することで可能です。

20121218_13h37_22

Reports Connect for Salesforce:Subreportで複合的な帳票を作成

Reports Connectサポートフォーラムを公開しました。

技術的質問はこちらへどうぞ

今回の記事で作成したjrxmlファイルは↓からダウンロードできます。

accounts.jrxml

contacts.jrxml

optunities.jrxml

Reports Connect for Salesforceの使い方シリーズも5回目になりました。
今回は、Subreportの設定方法に関して解説します。
なお、Reports Connect for Salesforceの基本的な使用法に関しては、こちらの記事から順番に読んでみてください。

iReportではSubreportを使用する事により、リポート上に複数のリポートを組み合わせて配置する事ができます。

Rc3dev00
たとえば、Salesforceの標準オブジェクトで言うと、取引先、取引先責任者、商談の関係は以下のようになっています。

Rc3dev01
取引先から見ると、1個の取引先に対してn個の取引先責任者およびn個の商談が関連づけられています。
これを、取引先を中心にして関連する取引先責任者と商談のリストを1枚で表示するレポートをSubreportの機能を使用して作成してみます。

Rc3dev01_2

まず、新規帳票として「取引先商談」を作成しました。

Rc3dev01_1
SOQLとしては、以下のようなサブクエリーを持った構造のものを使用します。

 SELECT Name, Type, Industry, Rating,
    (SELECT Name, Phone, Email, Title FROM Contacts),
    (SELECT Name, StageName, Amount, CloseDate FROM Opportunities)
  FROM Account

SOQLを設定して、データの確認ボタンを押すと、今回は3つのFile CSV Datasourceが出力されます。

Rc3dev02
一つ目が親のReport用、他の二つが子のReport用のDatasourceです。
この3つのDatasourceをそれぞれダウンロードします。

次にiReportを使用して、三つのDatasourceを取り込みます。

File CSV Datasourceの取り込み方法は、こちらの記事を参考にしてください。

次に、まず一つ目の子供のReport用の ContactsからReport作成を始めます。
今回は、Wizardを使用せずに、ファイル→Newと開いてBlank A4 Landscapeのテンプレートを選択して、Open This Templateボタンを押します。

Rc3dev02_1
すると、A4横のブランクの空のReportが開きます。

Rc3dev02_2

次に、先ほど取り込んだContactsのDatasourceを使用してFieldを作成します。
メニューの直下の現在のDatasourceをContactsに設定し、現在作成中のレポートのタブのPreviewの右にあるReport Queryボタンを押し、開いたダイアログの、CSV DatasourceのタブのGet fields from datasourceボタンを押すと、このデータソースからFieldを取り込む事ができます。

Rc3dev02_3

Fieldを取り込むと、画面左のReport InspectorのFieldsの中に取り込んだFieldが表示されます。
これをすべて選択して、ReportのDetail 1のbandへドラッグアンドドロップします。

Rc3dev02_4

この時点ですでにContactsのReportは一応Preview可能な状態まで出来ていますが、この後実用的なデザインにするために、不要なband(Title,Column Footer,Page Footer,Summary)を消して高さを調整し、Page Headerに「取引先責任者」というStatic Textを追加しました。

Rc3dev03_1

なお、この他にいつものように、languageをJavaに設定、漢字用のFontの設定等を行います。そのあたりの方法についてはこちらの記事を参考にしてください。

これで、contactsのReportは出来上がりです。

同様に、OptunitiesのReportも作成します。

Rc3dev03_2

さて、ここで親のReportの作成に取り掛かります。

同様にA4横の空のReportの状態から、親のデータソースからFiledを取り込んで、Page HeaderのbandにName,Type,Industory,RatingのFiledを配置しました。

また、Page Headerとdetail以外のbandを削除し、detailのフィールドを最大限広げておきます。

Rc3dev04_3

残りのField、contactsとoptunitiesはサブクエリーからContactとOptunityのコレクションオブジェクトが返るFieldです。そこで、このFieldのプロパティField Classを、java.lang.Objectに変更します。

Rc3dev04_4_2

同様に、Field OptunitiesのField Classも変更してください。

次に、Detail上をFrameで縦に二つのエリアに分割し、そこにパレットのウィンドウからSubreportをドラッグアンドドロップします。

Rc3dev04_2

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

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

Rc3dev05

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

Rc3dev06

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

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

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

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

できたSubreportは大きさを広げてDetailの上部半分を占める大きさに調整します。

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

Report accountsのプロパティのImportsの横のボタンを押して設定を追加します。

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

net.sf.jasperreports.engine.data.*

Rc3dev10

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

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

 $P{SUBREPORT_DIR} + "contacts.jasper"

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

Rc3dev08

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

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

同様にして、Subreport OptuinitiesをContactsの下の位置に設定します。

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

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

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

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

では、実際に出来上がったjrxmlファイルをReports Connectの帳票オブジェクトに添付して印刷してみましょう。

出来上がった3つのjrxmlファイルを帳票、取引先商談に添付します。

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

Rc3dev09

出来上がった帳票は、こんな感じ↓

Rc3dev13

今回は、Subreportの作り方を解説するのが目的なので、デザインはパッとしませんが、仕組みは理解できたかと思います。

 

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

Reports Connectサポートフォーラムを公開しました。

技術的質問はこちらへどうぞ

今回の記事で作成したjrxmlファイルは↓からダウンロードできます。

report1.jrxml

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

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

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

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

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

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

Rc2dev2
前回までに作成した、ユーザーリストに添付しました。

さて、これで外字が本当に出力されるか試してみます。
ユーザー名に先ほど作った外字を入れてみましょう。
やり方は、設定→私の個人情報→個人情報で編集ボタンを押します。

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

Rc2dev3_2
これで、保存して、ユーザーリストを出力すると...

Rc2dev4_2 おー、出ましたね。こんなに簡単に外字を扱うことができます。

なお、いちいち個々の帳票に添付するのではなく、管理レコードを作成しそちらにファイルを添付することですべての帳票に外字を反映する事もできます。

まず、新規帳票ボタンを押して、管理レコードのチェックを入れたレコードを新規に作成。

Rc2dev8 この管理レコードに外字ファイルを添付。

Rc2dev9

これで、すべての帳票からこの外字を使用する事ができます。

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

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

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

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

20121220_17h23_13

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

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

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

Rc2dev5

この状態で、ユーザーリストを印刷すると。

Rc2dev4_3おや?このままでは出ないようです。

そこで、iReportでjrxmlファイルを編集します。

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

Font name:  IPAmj明朝

PDF Font name:  Times-Roman

PDF Embeted:   true

PDF Encording:   Identity-H

Rc2dev6

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

Rc2dev7

おー、今度は見事に出力されました。

ちなみに、CreatedBy.Nameのフィールドは、設定を行っていないので、出ていません。

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

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

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

追記:2017/09/055 同様の方法で、IPAex明朝,IPAゴシック,IPA明朝 フォントが使用可能になりました。

Reports Connect for Salesforce アプリケーションへの組込み方法

Reports Connectサポートフォーラムを公開しました。

技術的質問はこちらへどうぞ

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

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

方法1:RPConnectコンポーネントを使用する

ReportsConnectのパッケージにはRPConnectというコンポーネントが含まれています。
これは、印刷ボタンを提供するコンポーネントになっていますので、まずはこれを使用してみます。

パッケージにはReportsTestという、サンプルページがあるので、このソースをもとにページを作ります。

---ReportsTest---

        <apex:page >
            <apex:form >
                <apex:pageBlock >
                    <apex:pageBlockButtons location="top">
                        <c:RPConnect reportId="ユーザーリスト" />
                    </apex:pageBlockButtons>
                    <label>DataCheck</label>
                    <input type="text" name="ksp_datacheck" value="" />
                </apex:pageBlock>
            </apex:form>
        </apex:page>

---

このソースをコピーして新たにページを作成します。新たなページにはUserlistPrintという名前で作りました。

作成したページの5行目

 <c:RPConnect reportId="ユーザーリスト" />

 <kpsr:RPConnect reportId="ユーザーリスト" />

に修正します。

なお、reportIdは出力する帳票に対応する帳票レコードの名前またはIDを指定してください。

Rcdev1

出来たページ(https://c.na11.visual.force.com/apex/UserlistPrint)を開くと印刷ページが表示されるのがわかります。

Rcdev2 印刷ボタンを押せば、前回作成した帳票を出力することができます。

このように、kpsr:RPConnectのタグだけで印刷ボタンを実装できました。

ちなみに、下に表示されているDataCheckのテキストボックスにtrueと入れて印刷ボタンを押すと、データの確認画面を表示することが可能ですので、デバッグの際にはこのボックスを表示して、必要に応じてtrueを入れてデバッグして、完成後に取り除くようにすれば便利です。

*SOQLの動的変更

しかし、実用的なアプリケーションを考えた場合、常に同じデータを印刷するとは考えにくい訳で、ユーザーの指定により、動的にSOQLの条件を変えられるようにしたいですね。

ReportsConnectでは帳票レコードに設定するSOQLに動的に変更可能な変数を組み込む事ができます。

前回作成したユーザーリストの帳票レコードのSOQLを以下のように変更します。

  SELECT Id, Username, Name, Email, Profile.Name, Profile.UserType, CreatedBy.Name

   FROM User :condition order by  Profile.UserType, Profile.Name

Rcdev3途中に追加した「:condition」が変数です。JDBCのprepared statementのような感じで、:(コロン)の後に指定した文字列が変数となります。

この変数の部分は変数名のリクエストパラメータと置き換えられます。

例えば、

   condition=where Profile.UserType='Standard'

といった感じでwhere文を送ってやれば、SOQLの条件を変更することができるはずです。

さっそくやってみましょう。

先ほどのページのDataCheckのテキストボックスに以下のような細工を施します

<apex:page >
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockButtons location="top">
                <kpsr:RPConnect reportId="ユーザーリスト" />
            </apex:pageBlockButtons>
            <label>Condition</label>
            <input type="text" name="condition" value="" /> ←nameをconditionに変更
        </apex:pageBlock>
    </apex:form>
</apex:page>

それで、このテキストボックスにwhere文を入れてみましょう。

    where Profile.UserType='Standard'

Rcdev4

これで、印刷ボタンを押すと、ユーザータイプがStandardのユーザーのみが出力されればひとまず成功。

ちなみに、帳票レコードのパラメーターの欄に、key=valueの形式でパラメーターを設定して、データの確認ボタンや、印刷テストの際にパラメーターを送ることができます。

Rcdev3_2

この欄には、複数行にわたって書けば複数のパラメータを送ることもできます。

ただし、これは開発用の機能で、データの確認ボタン、印刷テストボタンの押下時に反映されるだけで、実際のアプリケーションに組み込まれた後はなんの影響も与えません。

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

今回はさらに、このパラメーターを帳票上に表示できるようにします。

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

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

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

Rcdev6

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

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

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

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

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

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

Rcdev9

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

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

Rcdev11_3  

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

このように、リクエストパラメーターに文字列を乗せれば、帳票の任意の場所にそれを表示することができます。

*selectリストで条件選択

しかし、エンドユーザーがwhere文を自分で入れるという運用は現実には考えられないので、とりあえず、selectリストから選択できるようにしてみます。

Visualforceページを以下のように修正して、selectリストで選択すると、対応したcondintionが送られるようにします。

<apex:page >
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockButtons location="top">
                <select name="condition">
                    <option value="where Profile.UserType='Standard'">Standard</option>
                    <option value="">全件</option>
                </select>
              <kpsr:RPConnect reportId="ユーザーリスト" buttonvalue="ユーザーリスト出力"/>
            </apex:pageBlockButtons>
        </apex:pageBlock>
        <label>Data Check:</label>
        <input type="text" name="ksp_datacheck"/>
    </apex:form>
</apex:page>

なお、kpsr:RPConnectタグの、buttonvalue属性にボタンの文字列を指定することができます。
画面の表示はこんな風になります。

Rcdev12
方法2:自前のコントローラーでApexから呼び出す

コンポーネントを使用せずに自前のコントローラー内でReportsConnectControllerを使用する事もできます。

これにより、より柔軟な呼び出しが可能になります。

---サンプルVisualforceページ

<apex:page controller="Userlist">
    <apex:pageMessages id="msg"></apex:pageMessages>
    <apex:form >
    <apex:pageBlock >
        <apex:pageBlockButtons location="top">
                <apex:selectList size="1" value="{!ptype}">
                <apex:selectOption itemValue="Standard" itemLabel="Standard"/>
                <apex:selectOption itemValue="all" itemLabel="全件"/>
            </apex:selectList>
            <apex:commandButton action="{!goPrint}" value="印刷"  reRender="theBlock,msg" status="status"  />
            <apex:actionStatus startText="Requesting..." id="status"/>
        </apex:pageBlockButtons>
    </apex:pageBlock>
    </apex:form>
<apex:outputPanel id="theBlock">
<script type="text/javascript">
    if ("{!goUrl}" != ""){
       window.open("{!goUrl}",null,"scrollbars=no,width=1000,height=400");
    }
</script>
</apex:outputPanel>
</apex:page>

---

---コントローラー側のApexコード

public with sharing class Userlist {

    public String ptype { get; set; }

    private kpsr.ReportsConnectController rc;
   
    public Userlist(){
        rc = new kpsr.ReportsConnectController();
        rc.setReportId('ユーザーリスト');
    }

    public String goUrl { get; set; }

    public PageReference goPrint() {
   
        String ql = 'SELECT Id, Username, Name, Email, Profile.Name, Profile.UserType, CreatedBy.Name FROM User ';
        if(ptype == 'Standard'){
            ql = ql + 'where Profile.UserType=\'Standard\' order by Profile.UserType, Profile.Name';
        } else {
            ql = ql + 'order by Profile.UserType, Profile.Name';
        }
        rc.setSoql(ql);
        rc.getParms().put('condition',ptype);
        Pagereference ref = rc.goPrint();
        this.goUrl = rc.goUrl;
        return ref;
    }

}

---

Visualforce側では、印刷ボタンをコントローラーのgoPrintメソッドにバインディングしています。

ボタンにはreRenderを設定して、サンプルにあるjavascriptを再描画するようにしてください。これにより、goUrlに設定されたURLをサブウインドで開き、ReportsConnctサーバーにその後の処理を依頼することができます。

このソースは、パッケージに含まれる、ReportDevページのソースが参考になります。

---ReportDevのソース

<apex:page standardController="kpsr__Report__c" extensions="kpsr.ReportDev">
    <apex:pageMessages id="msg"></apex:pageMessages>
    <apex:form >
    <apex:pageBlock >
        <apex:pageBlockButtons location="top">
            <apex:commandButton action="{!doCheck}" value="データの確認"  reRender="theBlock,msg" status="status"  />
            <apex:commandButton action="{!doTestPrint}" value="印刷テスト"  reRender="theBlock,msg" status="status"  />
            <apex:actionStatus startText="Requesting..." id="status"/>
        </apex:pageBlockButtons>
            <apex:pageBlockSection columns="1" >
                <apex:pageblockSectionItem >
                    <apex:outputLabel >SOQL</apex:outputLabel>
                    <apex:inputTextarea value="{!soql}" cols="100"/>
                </apex:pageblockSectionItem>
                <apex:pageblockSectionItem >
                    <apex:outputLabel >パラメーター</apex:outputLabel>
                    <apex:inputTextarea value="{!parms}" cols="100"/>
                </apex:pageblockSectionItem>
            </apex:pageBlockSection>
    <apex:detail />
    </apex:pageBlock>
    </apex:form>
<apex:outputPanel id="theBlock">
<script type="text/javascript">
    if ("{!goUrl}" != ""){
       window.open("{!goUrl}",null,"scrollbars=yes,width=1000,height=400");
    }
</script>
</apex:outputPanel>


</apex:page>
---

コントローラーでは、コンストラクターでReportsConnectControllerのインスタンスを作成して、帳票レコード名をsetReportIdメソッドで設定します。

goPrintメソッド内では、ReportsConnectControllerに画面で選択された条件をもとにSOQLを作成してseSoqlメソッドで設定します。

また、getParmsメソッドで入手できるMapに自由にパラメーターを設定して、iReportのParametersに渡すことができます。

印刷要求はgoPrintメソッドを呼び出すことによって、処理され、goUrlに以降の処理用のURLが返ります。これをVisualforceページのJavascriptに引き渡します。

出力された帳票はこんな感じ

Rcdev13

今度は、ApexコードでparmsのMapに設定した文字列がTitleに出力されました。

このように、Apexコード内からSOQL文を自由に組み立てたり、Parametersでデータを引き渡すことができるので、自由度がかなり広がります。

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

Reports Connectサポートフォーラムを公開しました。

技術的質問はこちらへどうぞ

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

前回の記事で、force.com上の帳票の画面からiReportのDataSourceを出力できました。
今回はそのDataSourceをiReportから取り込むところから始めます。

前回の繰り返しになりますが、ReportsConnectの帳票を使用する際には、iReportの3.7.6を使用してください。

↑訂正:2013.9.30よりiReport5.2.0に対応しました

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

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

Ireportdataspource

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

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

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

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

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

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

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

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

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

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

Irpds7

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

Irpds8

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

とりあえず、Id以外全部入れてみます。

Irpds9

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

Profile.UserTypeとProfile.Nameでグルーピングします。

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

今回は、ちゃんとSOQLでorder by  Profile.UserType, Profile.NameとしてあるのでOK.

Irpds10

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

簡単だね。

Irpds11

出来上がった帳票レイアウトです。Previewボタンを押してイメージを見てみましょう。

Irpds12

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

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

Irpds14

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

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

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

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

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

Font name : MSゴシック

PDF Font name : HeiseiKakuGo-W5

PDF Encoding : UniJIS-UCS2-H

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

Irpds15

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

HeiseiKakuGo-W5 (ゴシック)

HeiseiMin-W3  (明朝)

また、PDF Encodingは

UniJIS-UCS2-H (横書き用)

UniJIS-UCS2-V (縦書き用)

となります。

再度、previewを見ると、漢字が出力されました。

Irpds16   

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

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

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

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

 

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

Reports Connectサポートフォーラムを公開しました。

技術的質問はこちらへどうぞ

今回の記事で作成したjrxmlファイルは↓からダウンロードできます。

report1.jrxml

2012年11月01日、 Reports Connect for Salseforceのフリー版がダウンロード可能になりました。

Reports Connect for Salseforce

なにしろ、force.com環境からきちっとした帳票を出そうとすると、至難の業で、このブログでも過去に開発方法を書いておりますが、そもそもHTMLベースでしかPDFの帳票を作れないというのは絶望的な話。

従来からデザインした帳票をSalesforceにつないで出力できるクラウドサービスはあるにはあったのだけど、結構月額料金が高くて少々敷居が高い。

今回使用する、「Reports Connect」という製品を使えば、かなり楽に自由度の高い帳票が作れるはずなので、やってみることにします。しかも、Free版は無料で使えるので、試してみない理由は無い!

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

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

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

 

なお、iReportの最新版は2012年11月現在、4.7.1なのですが、Reports Connectは、外字サポートの都合上、サバー側がJasperreports日本語版3.7.6を使用しているので、それに合わせたバージョン(3.7.6)を使用する必要があります。

↑訂正:2013.9.30よりiReport5.2.0に対応しました

iReportをインストールしたら、さっそくReports Connectを使ってみましょう。

まず、force.comの開発環境にログインします。
force.comの環境未入手の場合は、こちらからサインインしてください。

開発環境にログインした状態でReports Connect for Salseforceのページのダウンロードボタンを押します。

↓こんな感じでダウンロード画面が出るので、次へを押して自分の環境にインストールします。

Packageins

インストールができたら、さっそく帳票開発に取り掛かります。

まず、「帳票」というタブができていると思うので、それを開きます。

タブは、インストールした状態では表に出てきていないと思いますので、「+」のタブをクリックして、「すべてのタブ」を開いて、出てきた「帳票」タブをクリックします。

Rctab

一つの帳票に対して1件の帳票レコードを作成します。

帳票タブの新規ボタンを押して、帳票レコードを1件作成します。

20121022_16h11_41

帳票の編集画面が開くので、ここにデータを読み込むためのSOQLを入力します。

Rcedit

今回は、Userオブジェクトを読む以下のようなSOQLを入れてみました。

  SELECT Id, Username, Name, Email, Profile.Name, Profile.UserType, CreatedBy.Name 
    FROM User order by  Profile.UserType, Profile.Name

このSOQLは、Userオブジェクトと、Profileオブジェクトと、親のUserオブジェクト(CreateBy)の3つのオブジェクトをJoinして読むものです。

帳票名に適当に名前を付けて、保存ボタンを押すと、あれ?なんかエラーメッセージが...

Remotesiteer

Reports Connectはherokuサーバーにアクセスするので、セキュリティの設定が必要なようです。

メッセージの指示通りに、設定->セキュリティのコントロール->リモートサイトの設定とクリックして、支持されたURLを設定します。

Remotesite

リモートサイト名を適当につけて保存ボタンを押します。

帳票の画面に戻ったら、まずは、iReportにインポートするDataSourceの作成を行います。

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

Popuprock

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

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

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

Popup_2

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

Oauth

なにやら、許可を求めております。

これがつまりoAuth2.0の認証機能。ReportsConnectサーバーが今自分がログインしているforce.comのDBへアクセスする事に関する許可をユーザーに求めてきます。

許可を押して先に進みます。

なお、この認証画面は、許可を1回押せば、許可を取り消さない限り、次回からは出なくなります。

許可を取り消すのは、設定->私の個人情報->個人情報の画面のリモートアクセスのところからいつでも可能です。

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

Csvdown

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

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

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

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

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

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

« 2011年9月 | トップページ | 2012年12月 »