logo

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

最近のトラックバック

無料ブログはココログ

« Reports Connect for Salesforce ログインユーザー固定化オプションの使用法 | トップページ | Reports Connect for Salesforce Salesforce1アプリへの組み込み その2 »

Reports Connect for Salesforce Salesforce1アプリへの組み込み その1

Reports Connect for Salesforce ver1.19よりSalesforce1アプリからのモバイル環境での帳票作成が可能になりました。

今回は、まずは、特定のレコードに紐づく帳票をカスタムアクションに組み込む方法を解説します。(これをSalesforce1ではObject-Specific Actionと言います)

帳票自体の作成方法は従来のものがそのまま使用できます。印刷する帳票は「標準画面からの印刷呼び出し方法」で紹介した、商談の請求書を印刷するものをそのまま使用します。

帳票自体の作成方法はこちらの記事を参考にしてください。

[事前設定]

Salesforce1アプリからReportsConnectを使用するためには、事前に印刷をするユーザーのプロファイルで、ReportsConnectの接続アプリケーションを使用可能にしておく必要があります。

Reports Connect for Salesforce ver1.19以降をインストールすると、自動的にReportsConnectの接続アプリケーションが登録されます。

まず、設定->アプリケーションを管理する->接続アプリケーションで、「kps-ReportsConnect」を選択して、許可されているユーザが「管理者が承認したユーザは事前承認済み」になっていることを確認して下さい。もし、他の設定になっている場合は、「管理者が承認したユーザは事前承認済み」にしておきます。

20140304_15h35_21

次に、設定->ユーザーの管理->プロファイルで印刷するユーザーのプロファイルを選択して編集ボタンを押すと「接続アプリケーションへのアクセス」という欄に、「kps-ReportsConnect」という接続アプリケーションが有りますので、ここにチェックを入れてください。

20140304_15h26_29

次に、Mobile Design Templatesの設定を行います。

Salesforce1環境で、モバイル的なルックアンドフィールを実現するためには、セールスフォースから提供されている「Mobile Design Templates」を使用するというガイドラインがセールスフォースから出されています。

ReportsConnectでは、このテンプレートのCSS等を前提にしていますので、必要なCSSやJSライブラリーを静的リソースに入れておく必要があります。

GitHubのMobile Design Templatesのページからサンプルコードをダウンロードします。

ダウンロードした中のcommonというフォルダーにCSSやJSが入っています。このフォルダーをフォルダーごとzipで圧縮します。

20140304_16h31_42

このzipファイルを適当な名前を付けて静的リソースにアップロードしてください。

20140304_16h34_40 この例では、「MobileTempCommon」という名前でアップロードしました。

以上で事前設定は終了です。

[Visualforceページの作成]

カスタムアクションで使用するVisualforceページを作成します。

ソースコードは以下のとおりです。

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

<apex:page docType="html-5.0" standardStylesheets="false" showheader="false" sidebar="false" standardController="Opportunity">
      <!--Include Stylsheets for the Mobile look and feel -->
      <apex:stylesheet value="{!URLFOR($Resource.MobileTempCommon,
                'common/css/app.min.css')}"/>
      <apex:includeScript value="{!URLFOR($Resource.MobileTempCommon,
                'common/js/jQuery2.0.2.min.js')}"/>
      <apex:includeScript value="{!URLFOR($Resource.MobileTempCommon,
                'common/js/zebra_datepicker.min.js')}"/>
      <apex:includeScript value="{!URLFOR($Resource.MobileTempCommon,
                'common/js/main.min.js')}"/>
      <apex:includeScript value="{!URLFOR($Resource.MobileTempCommon,
                'common/js/jquery.nouislider.min.js')}"/>   
      
<apex:form >
<kpsr:RCOne reportId="請求書"
    parms="{&quot;condition&quot;:&quot;where OpportunityId='{!$CurrentPage.parameters.id}'&quot;}"/>
</apex:form>               
</apex:page>

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

apex:pageタグの指定とapex:stylesheetタグ、apex:includeScriptタグの指定は、「Mobile Design Templates」を使用する際のガイドライン通りのものです。(事前設定でアップロードした静的リソースを指定しています)

商談のページからアクションとして呼び出すにはapex:pageタグにstandardController="Opportunity"の指定が必要になります。

ReportsConnectを呼び出すために、ReportsConnectのインストールで提供される「kpsr:RCOne」コンポーネントを使用します。

apex:formタグの中にkpsr:RCOneタグを書いてください。属性として、帳票名をreportIdに指定します。

なお、このタグはparms属性で、json形式で、iReportに渡すためのパラメーターを指定できます。今回指定したパラメーターは以下のようなjsonを意味しています。

{"condition" : "where OpportunityId='{!$CurrentPage.parameters.id}'"}

このままVisualforceページに書くとエラーになるので、ダブルコーテーションの部分は&quot;に置き換えてエスケープします。

この帳票レコードのSOQLは以前の記事にあるように「condition」というKeyを検索条件で置き換える様になっているため、key「condition」に対して、where節を設定して、該当のレコードをReportsConnect側で読めるようにしているわけです。

Object-Specific Actionの場合は、idパラメータに該当のレコードのidが渡って来ますので、{!$CurrentPage.parameters.id}としてID値を入手しています。

以上のページを「PrintSeikyuOne」という名前で保存しました。

[Visualforceページをカスタムアクションに組み入れる]

後は、上記のVisualforceページを商談のカスタムアクションに組み入れるだけです。この作業は一般的なモバイルのカスタムアクションの組み込み方法と変わりはありません。

具体的には、以下の様な手順になります。

カスタムアクションの作成

  1. 設定->カスタマイズ->商談->ボタン、リンク、およびアクション
  2. 新規アクションを押す
  3. アクション種別でカスタム Visualforceを選択
  4. Visualforceページで、今作成した「PrintSeikyuOne」を選択
  5. 表示ラベルに「請求書作成」を入力
  6. 保存を押す

カスタムアクションをページレイアウトに追加

  1. 設定->カスタマイズ->商談->ページレイアウト
  2. 現在使用しているレイアウトを編集
  3. パブリッシャーアクションでグローバルパブリッシャーレイアウトを上書きをクリック
  4. 適当なパブリッシャーアクションの位置に上記で作成した「請求書作成」をドラッグ
  5. 保存を押す

[Salesforce1での帳票作成処理]

以上で組み込み作業は完了なので、Salesforce1アプリから商談を見てみましょう。

印刷したい商談の詳細画面でプラスボタンを押します。

20140304_17h25_06

設定したカスタムアクション「請求書作成」のアイコンが出てくるのでこれを押す

20140304_17h26_56

すると、帳票作成処理が実行されます。

帳票作成が完了すると画面は以下の様にファイル名と、ボタンの表示に変わります。

PDFファイルは処理したユーザーのフィードの添付として作成されます。

20140304_17h28_431

右側のボタンを押すと、フィードの画面へ遷移します。

20140304_17h36_52_2

フィードの添付ファイルなので、後は、ファイルを開いたり、メールに添付して送信したり自由にできます。

次回は、特定のレコードと関連しない帳票をモバイルナビゲーションから呼び出す方法について解説します。

« Reports Connect for Salesforce ログインユーザー固定化オプションの使用法 | トップページ | Reports Connect for Salesforce Salesforce1アプリへの組み込み その2 »

Force.com」カテゴリの記事

Reports Connect」カテゴリの記事

Salesforce」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/1482716/55232998

この記事へのトラックバック一覧です: Reports Connect for Salesforce Salesforce1アプリへの組み込み その1:

« Reports Connect for Salesforce ログインユーザー固定化オプションの使用法 | トップページ | Reports Connect for Salesforce Salesforce1アプリへの組み込み その2 »