Admin Console部分の共通設定

1. 概要

サンプルの各実装でAdmin Console部分の共通設定です。

1.1. Calendar

このサンプルではCalendar機能を利用しています。マネージャーまたはオペレーターに属するユーザーが管理用Top画面のカレンダーで請求エンティティに登録された納品予定日を確認する事が出来ます。
カレンダーの作成する方法は開発者ガイドのCalendarの章を参照してください。

sample ec adminconsole calendar settlement

1.2. TreeView

このサンプルではTreeViewの機能を利用しています。マネージャーまたはオペレーターに属するユーザーが管理用Top画面の左側のウェジェットエリアに商品情報のツリーが見えます。 TreeViewの作成方法は開発者ガイドTreeViewの章を参照してください。

sample ec adminconsole treeview product

1.3. Entity多言語対応

画面の表示メッセージは多言語利用が可能です。それ以外に、Entityレベルの多言語利用も可能です。
Entityの定義にて、以下の二つの方法で多言語対応が可能です。詳しくは開発者ガイドデータの多言語対応の章を参照してください。

プロパティ単位の多言語化

設定方法

同一Entity内に多言語用ラベルのプロパティを持つ

Entity定義のプロパティとして、 propA propA_en propA_ja のように、多言語用のラベルを別途保持する形式。

property名_言語

sample ec adminconsole entity multilang property
  1. 多言語用ラベルのプロパティを作成します。

  2. "Data Localize Type"を"Each Property"に指定します。

  3. "Support Language"の言語項目にチェックを入れます。

画面表示

日本語用Top画面と英語用Top画面

sample ec adminconsole entity multilang property result

レコード単位の多言語化

設定方法

多言語別にEntityを複数レコード登録する

Entity定義のプロパティとして、言語判別用プロパティを定義。 例えば、"lang"といったプロパティ名で。

このパターンの場合、 Entityに「多言語判別用プロパティ」および「対応済言語」を設定することにより、 Entityデータ検索時に自動的に当該プロパティにユーザーの言語をセットして検索する。

sample ec adminconsole entity multilang instance

  1. 言語判別用プロパティを作成します。

  2. "Data Localize Type"を"Each Instance"に指定します。

  3. "Language"に作成した言語判別用プロパティを指定します。

  4. "Support Language"の言語項目にチェックを入れます。

画面表示

日本語用Top画面と英語用Top画面

sample ec adminconsole entity multilang instance result

言語別に同じ画面で異なるEntityデータを表示することができます。

1.4. 一括更新画面

設定方法

管理用画面にカスタムの画面を組み込むことが出来ます。
マネージャーまたはオペレーターに属するユーザーが商品の在庫状況を一括更新できる機能を例として説明して行きます。

  • Commandの定義

    在庫一括表示用Commandクラス

    ファイル名

    src/main/java/samples/ec01/command/backoffice/stock/StockBulkViewCommand.java

    @ActionMapping(
            name = "samples/ec01/backoffice/stock/stockUpdate", (1)
            displayName = "在庫一括表示",
            privileged = false, (2)
            result = @Result(
                    type = Type.TEMPLATE,
                    value = "samples/ec01/backoffice/stock/stockUpdate"))
    @CommandClass(
            name = "samples/ec01/backoffice/stock/StockBulkViewCommand",
            displayName = "在庫一括表示コマンド")
    public class StockBulkViewCommand implements Command {
    ----------------------------------------以下略----------------------------------------
    1 在庫一括表示用Action
    2 特権実行モードをfalseに指定します。

    在庫一括更新用Commandクラス

    ファイル名

    src/main/java/samples/ec01/command/backoffice/stock/StockBulkUpdateCommand.java

    @ActionMapping(
            name = "samples/ec01/backoffice/stock/doStockUpdate",  (1)
            displayName = "在庫一括更新",
            privileged = false, (2)
            result = @Result(
                    type = Type.TEMPLATE,
                    value = "samples/ec01/backoffice/stock/stockUpdate"))
    @CommandClass(
            name = "samples/ec01/backoffice/stock/StockBulkUpdateCommand",
            displayName = "在庫一括更新コマンド")
    public class StockBulkUpdateCommand implements Command {
    
        private final String RESULT_PRODUCT_LIST = "productList";
    
        @Override
        public String execute(RequestContext request) {
    ----------------------------------------以下略----------------------------------------
    1 在庫一括更新用Action
    2 特権実行モードをfalseに指定します。
  • Templateの定義

    • JSPを利用してテンプレートを作成してます。

      ファイル名

      src/main/webapp/jsp/samples/ec01/backOffice/stock/stockUpdate.jsp

    • レイアウトテンプレートを指定します。

      ファイル名

      src/main/resources/samples-ec01-ce-metadata.xml

          <!-- Backoffice pages start -->
          <metaDataEntry>
              <metaData xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                  xsi:type="metaJspTemplate">
                  <name>samples/ec01/backoffice/stock/stockUpdate</name>
                  <displayName>在庫一括更新画面</displayName>
                  <path>/jsp/samples/ec01/backOffice/stock/stockUpdate.jsp</path>
                  <layoutId>/action/gem/layout/defaultLayout</layoutId> (1)
                  <contentType>text/html; charset=utf-8</contentType>
              </metaData>
          </metaDataEntry>
          <!-- Backoffice pages end -->
      1 利用するレイアウトテンプレートを管理用画面のものに指定します。
  • Topメニュー画面

    • 一括更新画面を表示するアクションメニューを新規作成します。

      sample ec adminconsole bulkupdate actionmenu
      1. 在庫一括表示用Actionクラスを指定します。

    • 作成したアクションメニューをマネージャーとオペレーター用Topメニューに組み込みます。

      sample ec adminconsole bulkupdate topmenu
      1. マネージャーに属するユーザー用Topメニュー画面の定義

      2. マネージャーに属するユーザー用Topメニュー画面に在庫一括表示用Actionメニューを組み込みます。

画面表示

sample ec adminconsole bulkupdate update
  1. EC商品管理メニューを開き、在庫一括更新メニューをクリックします。

  2. 更新したい商品の在庫数を入力して一括更新ボタンをクリックします。

1.5. 帳票出力

このサンプルでは2種類の帳票出力機能(請求書ダウンロード(JasperReports)と注文明細ダウンロード(POI))が利用されています。
POIを利用した注文明細帳票(Excel形式)のダウンロード機能の実装はサンプルの実装方法によって異なっている為、詳細は各サンプルの説明を参照してください。

請求書ダウンロード(JasperReports)

JasperReportsを用いて、PDF形式の帳票出力を実行することが可能です。
以下では、このサンプルで利用されているPDF形式の請求書ダウンロード機能を実装する為に必要な一連の設定について説明します。

設定方法
  • Command

    帳票出力の前に実行されるCommandクラス(ここではJavaの実装例)

    ファイル名

    src/main/java/samples/ec01/command/backoffice/report/SettlementViewCommand.java

        @Override
        public String execute(RequestContext request) {
            String oid = request.getParam(PARAM_OID);
            // 汎用的な検索
            Query query = Query.newQuery("select oid, order.customer, order.orderItem.product.name,"
                    + " order.orderItem.quantity, order.orderItem.product.price, order.orderItem.price "
                    + " from samples.ec01.order.Settlement where oid = '" + StringUtil.escapeEql(oid) + "'"); (1)
            List<Object[]> result = EntityDaoHelper.search(query);
            // 初期化
            for (int cnt = 0; cnt < MAX_CNT; cnt++) {
                request.setAttribute(RESULT_PRODUCT + cnt, "");
                request.setAttribute(RESULT_QUANTITY + cnt, 0L);
                request.setAttribute(RESULT_ITEM_PRICE + cnt, 0L);
                request.setAttribute(RESULT_PRICE + cnt, 0L);
            }
            int cnt = 0;
            Long totalPrice = 0L;
            for (Object[] obj : result) {
                String customer = (String) obj[1];
                String product = (String) obj[2];
                Long quantity = (Long) obj[3];
                Long itemPrice = (Long) obj[4];
                Long price = (Long) obj[5];
    
                request.setAttribute(RESULT_CUSTOMER, customer); (2)
                request.setAttribute(RESULT_PRODUCT + cnt, product); (2)
                request.setAttribute(RESULT_QUANTITY + cnt, quantity); (2)
                request.setAttribute(RESULT_ITEM_PRICE + cnt, itemPrice); (2)
                request.setAttribute(RESULT_PRICE + cnt, price); (2)
                totalPrice = totalPrice + price;
                cnt++;
            }
            request.setAttribute(RESULT_TOTAL_PRICE, totalPrice); (2)
    
            return Constants.CMD_EXEC_SUCCESS;
        }
    1 データ検索処理を実行します。
    2 RequestContextに検索データをセットします。
  • Template

    帳票出力テンプレート定義を設定します。

    ※ 帳票テンプレート定義に関する各設定項目の詳細は、開発者ガイド帳票出力(Jasper/JXLS/POI)の章を参照してください。

    sample ec adminconsole report jasper template

    1. 呼び出される請求書の帳票テンプレート定義

    2. jrxml(JasperでテンプレートとなるXMLファイル)テンプレートファイルを指定します。

    3. 事前のCommandクラスで検索データを格納したRequestContextのAttribute名を指定します。

    4. 言語別に帳票出力テンプレート定義を設定することが可能です。

  • Action

    sample ec adminconsole report action
    1. 帳票出力の前に実行するCommandクラス。

    2. 帳票テンプレート定義。

  • EntityViewの詳細画面のカスタマイズ

    請求エンティティを右クリックし、「Detail_Layoutを開く」ボタンをクリックします。
    編集ボタンをクリックします。

    sample ec adminconsole report customview
    sample ec adminconsole report customview settings
    1. エンティティの詳細画面にカスタムのボタンを表示します。

    2. カスタムボタンのラベルを設定します。

    3. クリックイベント関数を設定します。

画面表示

請求書ダウンロード機能の画面表示
管理用画面で請求検索一覧画面を開き、詳細リンクをクリックします。

sample ec adminconsole report settlement detail

「請求書ダウンロード」ボタンをクリックします。

sample ec adminconsole report settlement download

ダウンロードしたPDF帳票の中身を確認します。
このサンプルでは、英語用の帳票テンプレートも別途用意しています。

sample ec adminconsole report settlement downloadfile

1.6. 検索結果の一括更新機能

設定方法

EntityViewのSearch_Layout設定からEntityの検索画面をカスタマイズすることが可能です。
サンプルでは、マネージャーまたはオペレーターに属するユーザーが、商品の検索結果の一覧から指定したレコードを一括更新できる機能をデフォルトで有効化しています。
この機能の詳細は、DeveloperGuideのEntityView:2.3. 一括更新画面を参照してください。

  • EntityViewのSearch_Layout設定

    • 商品のEntityView(Search_Layout)をカスタマイズし、検索画面の一括更新機能を有効化します。

      sample ec adminconsole searchview bulkupdate searchview
sample ec adminconsole searchview bulkupdate searchresultsection
  1. 「一括更新ボタンを表示」にチェックを入れます。

  2. サンプルでは、「BulkViewレイアウト定義を利用」にチェックを入れています。

    この設定により、BulkViewLayoutを利用して一括更新画面を生成し、複数項目を一括更新することが可能です。(単一の項目のみを更新する様な設定もあります。)

画面表示

商品の検索結果画面の下部に「一括更新」ボタンが追加されています。

sample ec adminconsole searchview bulkupdate searchresult

検索結果のレコードを選択して、「一括更新」ボタンを押下すると、下図の様にBulkViewLayoutを利用した一括更新画面が表示されます。(サンプルでは、デフォルトのBulkViewLayoutを利用)
任意の項目を入力し、一括更新画面下部の「一括更新」ボタンを押下することで、指定したレコードの任意の項目を一括で更新することが可能です。

sample ec adminconsole searchview bulkupdate bulkupdate