4月は新入社員も入社し、新たな出会いのある季節になりましたね。
SkyVisualEditor(以下、SVE)にも良い出会いがあり、グレープシティ社の「GrapeCity Barcode for Salesforce」(以下、GrapeCity Barcode)を SVE の AppComponent にご対応いただきました。
グレープシティ株式会社 ニュースリリース："SkyVisualEditor"でバーコード自由自在
https://gcsf.grapecity.com/news/newsrelease/20170308.htm
今回のご対応により、SVE で作成した画面や帳票(PDF)画面に GrapeCity Barcode で生成するバーコードを出力することができるようになりました。
ということで、今回のブログは、AppComponent 『GrapeCity Barcode』 の紹介をします。
GrapeCity Barcode とは
グレープシティ社が提供する、Salesforce上のデータをバーコード化できるサービスです。
QRコードやGS1データバー、郵便バーコード、JANコード、ITFなど国内外の標準規格のシンボルをほとんどサポートしており、AppExchangeからインストールするだけですぐに利用することができます。GrapeCity Barcode は今回の対応により、Visualforceページ、Lightningコンポーネントに追加し、SkyVisualEditor上からの利用も可能です。
詳細は、グレープシティ社ウェブサイトをご覧ください。
見積書帳票画面（PDF画面）を作ってみよう
今回作成する見積書：
- PDF画面である
- 見積書自体(見積番号)のバーコードが表示されている
- 各商品(品番マスタコード)のバーコードが表示されている
手順：
- AppComponent 『GrapeCity Barcode』をインストール
- SVE画面にAppComponent 『GrapeCity Barcode』を配置、設定
- デプロイ
手順1： AppComponent 『GrapeCity Barcode』をインストール
テラスカイのホームページ、またはAppExchangeサイトからAppComponent 『GrapeCity Barcode』をSalesforceにインストールしてください。AppComponentの設定詳細はGrapeCity Barcodeのヘルプドキュメントをご確認ください。
手順2： SVE画面にAppComponent 『GrapeCity Barcode』を配置、設定
a. AppComponent 『GrapeCity Barcode』を配置
SVE Studio画面で見積書ページを作成します。主オブジェクトに「見積」オブジェクト、関連オブジェクトとして「見積明細」オブジェクトを使用してページを作成しているものとします。そこに、ドラッグ・アンド・ドロップでAppComponent 『GrapeCity Barcode』を配置し、プロパティ値を設定します。
バーコード表示は、主オブジェクトの「見積番号」項目、関連オブジェクトの「品番マスタ」項目の値を対象とするので、パネルグリッドとデータテーブル内に配置します。AppComponent 『GrapeCity Barcode』は、ページ直下やパネルグリッド内、データテーブル内等、あらゆる場所に配置可能なコンポーネントになっています。
b. プロパティ設定
主オブジェクト「見積」の「見積番号」項目には下記を設定します。
| プロパティ名 | 設定値 | |
| バーコード種類 | "DataMatrix" を選択 | |
| 親レコード | "{!record}" | |
| バーコード値項目 | オブジェクト： データテーブルで使用している関連オブジェクト「見積明細」 項目： 主オブジェクトに関連付いている参照項目「見積」 |
|
| 関連オブジェクト | バーコード表示対象項目「見積番号」のAPI参照名 "Name" |
関連オブジェクト「見積明細」の「品番マスタ」項目には下記を設定します。
| プロパティ名 | 設定値 | |
| バーコード種 | "Code128" を選択 | |
| 親レコード | "{!item.record}" 関連オブジェクトに対するバーコードのため、データテーブルのプロパティ「var」値"item"のレコード情報 |
|
| バーコード値項目 | オブジェクト： データテーブルに表示している関連オブジェクト「見積明細」 項目： バーコード表示対象項目の「品番マスタ」 |
ところで、バーコードの種類って沢山ありますよね。こんなに種類があるのを知りませんでした ^^;
参考に、グレープシティ社のサイトにある対応バーコード一覧を貼っておきます。詳細はサイトを確認ください。
c. ページをPDF化
作成したページをPDF化するために、ページプロパティ「PDF化」にチェックを設定します。
手順3： デプロイ
以上で設定が完了したので、デプロイしてページを表示してみます。
期待通りにバーコード表示がされていますね。
最後に
Salesforceから帳票を出力したい。帳票にはバーコードを出力したいというご要望を度々いただいています。
グレープシティ社にご対応頂いたAppComponentで、少しでもご要望を叶えられると嬉しいです。
最後になりますが、AppComponent対応いただきました、グレープシティ株式会社様にこの場を借りまして御礼申し上げます。
ありがとうございました！