The PEXA Client - 定義パターン

PEXA Clientについて

チュートリアル

定義パターン

定義ファイル

リファレンス

はじめに

Menuパターンのサンプル画面イメージ

MenuのContent定義サンプル

MenuのContent定義解説

Area定義サンプル

Area定義解説

はじめに

このドキュメントは、定義パターン"Menu"の内容について解説する物です。

Menuパターンは、ポータル的な画面やショートカットメニュー系の画面内領域によく現れる定義パターンです。
他のパターンと同じ画面内に現れることも多いパターンです。

一般的には画面遷移を行うための遷移メニューになったり、実行ボタンの代わりに使用されたりします。メニュー項目が動的に変化する場合が無ければContentを定義する必要は無く、Page定義とArea定義で表すことが出来ます。これは、画面遷移情報が全てPage定義およびArea定義に記述されるためです。

以下で、画面イメージ及び定義ファイルのサンプルを元に内容を解説していきます。

Menuパターンのサンプル画面イメージ

Menuパターンをとる画面のサンプルとなる画面イメージです。

例１：ログイン後のポータルとなる、業務メニュー画面

例２：画面内に現れるショートカットメニューやメニューバーなど

このように、Menuパターンは業務メニュー、メニューバー、ショートカットメニューといったような形で画面上に現れます。
これをPEXAクライアントフレームワークではステレオタイプ"Menu"のContentとして表現します。
ただし、この定義パターンではContent定義の作成は必須ではありません。画面遷移の情報は全てPage定義及びArea定義に記述されるためです。

メニュー項目が動的に変わるようなケースの場合は、Content定義を作成して、メニュー項目そのものをContent項目として定義する事で対応できます。

MenuのContent定義サンプル

現状ではサンプルがないので割愛します。

MenuのContent定義解説

MenuのContentは、メニュー項目が動的になる場合を除いて、作成は必須ではありません。
作成するのであれば、メニューで選択できる遷移先をtransition-listセクションに記述するのが主な内容となります。このtransition-listで定義された内容は、画面の動作時には参照されません。Content定義間の概念的なリンクを表しているだけです。

メニュー項目が動的となるようなMenuのContentは、基本的に以下のような機能を持ちます。

画面に表示するメニュー項目をContent項目として持つ

メニュー項目の取得サービスの呼び出しを行う

上記を実現するための記述内容をitem及びactionの定義内容としてそれぞれ解説します。

item定義

ステレオタイプ"Menu"のContentで定義されるitemには、主に以下のような項目があります。

動的に表示するメニュー項目

action定義

ステレオタイプ"Menu"のContentで定義されるactionには、主に以下のものがあります。

動的なメニュー項目の取得サービスを呼び出すaction

Area定義サンプル

例１：ログイン後のポータルとなる、業務メニュー画面

<?xml version="1.0" encoding="Windows-31J"?>
<!--
- Copyright
-->
<!DOCTYPE client-area SYSTEM "../doctype/client-area.dtd">
<!--==============================================================
== Current-Module:
== Release-Date:
== Release-Version:
== First-Created-On:
== First-Created-By:
== Copy-Right-Owner:
==============================================================-->
<client-area>
    <!-- エリア属性値 -->
    <identity id="CA_AC_000_03_DomainPortal" name="会計ドメインポータルエリア"/>

    <!-- 詳細説明 -->
    <description>会計ドメインポータルのメニューを表示するエリアです。</description>

    <!--==============================================================
    ==  参照するコンテンツの宣言
    ==============================================================-->
    <reference-list>
    </reference-list>
    <!--==============================================================
    ==  表示レイアウト情報
    ==============================================================-->
    <layout ref="PanelLayout">
        <gui implement="imeg.client.view.rich.area.ac.AC_DomainPanel"/>
    </layout>
    <!--==============================================================
    ==  コンポーネントマッピング
    ==============================================================-->
    <component-mapping>
        <TreeMenu id="会計ドメインメニューツリー">
            <MenuItem text="会計ドメイン">

                <!-- ================================================= -->
                <!-- 支払管理メニュー                                  -->
                <!-- ================================================= -->
                <MenuItem text="支払管理">
                    <MenuItem text="支払入力">
                        <MenuItem text="ワークフロー取込" onClick="COMMAND[支払入力.ワークフロー取込]"/>
                        <MenuItem text="伝票入力" onClick="COMMAND[支払入力.伝票入力]"/>
                    </MenuItem>
                    <MenuItem text="支払処理" onClick="COMMAND[支払処理]"/>
                    <MenuItem text="支払照会" onClick="COMMAND[支払照会]"/>
                </MenuItem>

                <!-- ================================================= -->
                <!-- 支払入力メニュー                                  -->
                <!-- ================================================= -->
                <MenuItem text="源泉・支払調書">
                    <MenuItem text="月次処理" onClick="COMMAND[月次処理]"/>
                    <MenuItem text="年次処理" onClick="COMMAND[年次処理]"/>
                </MenuItem>

                <!-- ================================================= -->
                <!-- 会計処理(財務会計)メニュー                        -->
                <!-- ================================================= -->
                <MenuItem text="会計処理（財務会計）">
                    <MenuItem text="売上" onClick="COMMAND[売上]"/>
                    <MenuItem text="売上原価(直接原価）" onClick="COMMAND[売上原価]"/>
                    <MenuItem text="予定原価">
                        <MenuItem text="ワークフロー取込" onClick="COMMAND[予定原価.ワークフロー取込]"/>
                        <MenuItem text="伝票入力" onClick="COMMAND[予定原価.伝票入力]"/>
                    </MenuItem>

                    <MenuItem text="配賦・全部原価" onClick="COMMAND[配賦・全部原価]"/>
                    <MenuItem text="承認処理">
                        <MenuItem text="一括" onClick="COMMAND[承認処理一括]"/>
                        <MenuItem text="個別" onClick="COMMAND[承認処理個別]"/>
                        <MenuItem text="月次締め処理" onClick="COMMAND[承認処理月次締め処理]"/>
                        <MenuItem text="履歴" onClick="COMMAND[承認処理履歴]"/>
                    </MenuItem>
                </MenuItem>

                <!-- ================================================= -->
                <!-- 管理会計メニュー                                  -->
                <!-- ================================================= -->
                <MenuItem text="管理会計">
                    <MenuItem text="予算管理" onClick="COMMAND[予算管理]"/>
                    <MenuItem text="月次報告書" onClick="COMMAND[月次報告書]"/>
                    <MenuItem text="その他帳票" onClick="COMMAND[その他帳票]"/>
                </MenuItem>

                <!-- ================================================= -->
                <!-- 外部システム連動メニュー                          -->
                <!-- ================================================= -->
                <MenuItem text="外部システム連動">
                    <MenuItem text="SCAW" onClick="COMMAND[SCAW]"/>
                    <MenuItem text="DIVA" onClick="COMMAND[DIVA]"/>
                </MenuItem>

                <!-- ================================================= -->
                <!-- マスタメンテメニュー                              -->
                <!-- ================================================= -->
                <MenuItem text="マスタメンテ">
                    <MenuItem text="ワークフロー取込." onClick="COMMAND[マスタメンテ.ワークフロー取込]"/>
                    <MenuItem text="会計関連マスタ" onClick="COMMAND[マスタメンテ.会計関連マスタ]"/>
                </MenuItem>
            </MenuItem>
        </TreeMenu>
    </component-mapping>
    <!--==============================================================
    ==  コマンド定義
    ==============================================================-->
    <command-list>
        <!-- ================================================= -->
        <!-- 支払管理メニューからの遷移                        -->
        <!-- ================================================= -->
        <command id="支払入力.ワークフロー取込">
            <doTransition transit="ワークフロー取込クライアントポータルに遷移"/>
        </command>
        <command id="支払入力.伝票入力">
            <doTransition transit="伝票入力クライアントポータルに遷移"/>
        </command>
        <command id="支払処理">
            <doTransition transit="支払処理クライアントポータルに遷移"/>
        </command>
        <command id="支払照会">
            <doTransition transit="支払照会クライアントポータルに遷移"/>
        </command>
        <!-- 徴収源泉/支払調書管理 -->
        <command id="月次処理">
            <doTransition transit="月次処理クライアントポータルに遷移"/>
        </command>
        <command id="年次処理">
            <doTransition transit="年次処理クライアントポータルに遷移"/>
        </command>
        <!-- ================================================= -->
        <!-- 会計処理（財務会計）メニューからの遷移            -->
        <!-- ================================================= -->
        <command id="売上">
            <doTransition transit="売上クライアントポータルに遷移"/>
        </command>
        <command id="売上原価">
            <doTransition transit="売上原価クライアントポータルに遷移"/>
        </command>
        <command id="予定原価.ワークフロー取込">
            <doTransition transit="予定原価.ワークフロー取込クライアントポータルに遷移"/>
        </command>
        <command id="予定原価.伝票入力">
            <doTransition transit="予定原価クライアントポータルに遷移"/>
        </command>
        <command id="配賦・全部原価">
            <doTransition transit="配賦・全部原価クライアントポータルに遷移"/>
        </command>
        <command id="承認処理個別">
            <doTransition transit="承認処理個別クライアントポータルに遷移"/>
        </command>
        <command id="承認処理一括">
            <doTransition transit="承認処理一括クライアントポータルに遷移"/>
        </command>
        <command id="承認処理月次締め処理">
            <doTransition transit="月次締め処理クライアントポータルに遷移"/>
        </command>
        <command id="承認処理履歴">
            <doTransition transit="承認処理履歴クライアントポータルに遷移"/>
        </command>
        <!-- ================================================= -->
        <!-- 管理会計メニューからの遷移                        -->
        <!-- ================================================= -->
        <command id="予算管理">
            <doTransition transit="予算管理クライアントポータルに遷移"/>
        </command>
        <command id="月次報告書">
            <doTransition transit="月次報告書クライアントポータルに遷移"/>
        </command>
        <command id="その他帳票">
            <doTransition transit="その他帳票クライアントポータルに遷移"/>
        </command>
        <!-- ================================================= -->
        <!-- 外部システム連動メニューからの遷移                        -->
        <!-- ================================================= -->
        <command id="SCAW">
            <doTransition transit="SCAWクライアントポータルに遷移"/>
        </command>
        <command id="DIVA">
            <doTransition transit="DIVAクライアントポータルに遷移"/>
        </command>
        <!-- ================================================= -->
        <!-- マスタメンテメニューからの遷移                        -->
        <!-- ================================================= -->
        <command id="マスタメンテ.ワークフロー取込">
            <showMessageDialog message="支払先登録申請書の登録を行う"/>
        </command>
        <command id="マスタメンテ.会計関連マスタ">
            <doTransition transit="マスタメンテナンスクライアントポータルに遷移"/>
        </command>
    </command-list>

    <!--==============================================================
    ==  ファイル編集情報
    ==============================================================-->
    <status>
        <author></author>
        <datetime></datetime>
        <version></version>
    </status>
</client-area>

例２：画面内に現れるショートカットメニューやメニューバーなど

<?xml version="1.0" encoding="Windows-31J"?>
<!--
 - Copyright
 -->
<!DOCTYPE client-area SYSTEM "../doctype/client-area.dtd">
<!--==============================================================
 == Current-Module:
 == Release-Date:
 == Release-Version:
 == First-Created-On:
 == First-Created-By:
 == Copy-Right-Owner:
 ==============================================================-->
<client-area>
    <!-- エリア属性値 -->
    <identity id="CA_AC_000_02_DomainPortalMenuBar"
              name="メニューバーエリア"/>

    <!-- 詳細説明 -->
    <description>ドメインポータル画面のメニューバーとなるエリアです。</description>
<!--==============================================================
  ==  参照するコンテンツの宣言
  ==============================================================-->
    <reference-list>
        <content ref="CC_AC_02_Logout"/>
    </reference-list>
<!--==============================================================
  ==  表示レイアウト情報
  ==============================================================-->
    <layout ref="パネルエリア">
        <gui implement="imeg.client.view.rich.area.share.MenuBarPanel"/>
    </layout>
<!--==============================================================
  ==  コンポーネントマッピング
  ==============================================================-->
    <component-mapping>
        <Panel id="コンテナパネル" background="color:255,255,255"></Panel>
        <LinkMenu id="メニューバーリンクメニュー" direction="horizontal" foreground="color:51,51,255">
            <MenuItem text="ヘルプ" onClick="COMMAND[ヘルプ画面起動]"/>
            <MenuItem text="ログアウト" onClick="COMMAND[ログアウト]"/>
        </LinkMenu>
    </component-mapping>
<!--==============================================================
  ==  コマンド定義
  ==============================================================-->
    <command-list>
        <command id="ヘルプ画面起動">
            <doTransition transit="ヘルプ画面起動"/>
        </command>
        <command id="ログアウト">
            <doAction content="CC_AC_02_Logout" action="ログアウト"/>
            <doTransition transit="ログイン画面に戻る"/>
        </command>
    </command-list>
<!--==============================================================
  ==  ファイル編集情報
  ==============================================================-->
    <status>
        <author></author>
        <datetime></datetime>
        <version></version>
    </status>
</client-area>

Area定義解説

Menuパターンの画面のArea定義では、画面上でメニューを表現するコンポーネントの制御タグを記述し、それぞれのメニュー項目とそれらを選択したときに発行するイベントをマッピングします。
動的なメニュー項目を扱う場合は、Content定義で定義したメニュー項目とメニューコンポーネントをリンクします。ただしその場合でもやはりメニュー項目及びイベントとのマッピングは行います。
component-mapping定義
サンプルのArea定義では、メニューコンポーネントに対して以下のような設定を行っています。

例１ : 業務メニューをTreeのコンポーネントとして表現し、それぞれの項目とイベントをマッピングする

例２ : メニューバーをLinkのコンポーネントとして表現し、それぞれの項目とイベントをマッピングする

Treeとしてメニューを表す場合、コンポーネントの制御タグとしてTreeMenuタグを使用します。このタグでは、MenuItemタグを使用して、Treeとして表現する構造をそのまま入れ子構造で定義できるようになっています。クリックすることでイベントを発行するノードとなるMenuItemタグには、onClick属性で発行イベントを設定しています。
<TreeMenu id="会計ドメインメニューツリー">
    <MenuItem text="会計ドメイン">

        
        
        
        <MenuItem text="支払管理">
            <MenuItem text="支払入力">
                <MenuItem text="ワークフロー取込" onClick="COMMAND[支払入力.ワークフロー取込]"/>
                <MenuItem text="伝票入力" onClick="COMMAND[支払入力.伝票入力]"/>
            </MenuItem>
            <MenuItem text="支払処理" onClick="COMMAND[支払処理]"/>
            <MenuItem text="支払照会" onClick="COMMAND[支払照会]"/>
        </MenuItem>

        
        
        
        <MenuItem text="源泉・支払調書">
            <MenuItem text="月次処理" onClick="COMMAND[月次処理]"/>
            <MenuItem text="年次処理" onClick="COMMAND[年次処理]"/>
        </MenuItem>

        
        
        
        <MenuItem text="会計処理（財務会計）">
            <MenuItem text="売上" onClick="COMMAND[売上]"/>
            <MenuItem text="売上原価(直接原価）" onClick="COMMAND[売上原価]"/>
            <MenuItem text="予定原価">
                <MenuItem text="ワークフロー取込" onClick="COMMAND[予定原価.ワークフロー取込]"/>
                <MenuItem text="伝票入力" onClick="COMMAND[予定原価.伝票入力]"/>
            </MenuItem>

            <MenuItem text="配賦・全部原価" onClick="COMMAND[配賦・全部原価]"/>
            <MenuItem text="承認処理">
                <MenuItem text="一括" onClick="COMMAND[承認処理一括]"/>
                <MenuItem text="個別" onClick="COMMAND[承認処理個別]"/>
                <MenuItem text="月次締め処理" onClick="COMMAND[承認処理月次締め処理]"/>
                <MenuItem text="履歴" onClick="COMMAND[承認処理履歴]"/>
            </MenuItem>
        </MenuItem>

        
        
        
        <MenuItem text="管理会計">
            <MenuItem text="予算管理" onClick="COMMAND[予算管理]"/>
            <MenuItem text="月次報告書" onClick="COMMAND[月次報告書]"/>
            <MenuItem text="その他帳票" onClick="COMMAND[その他帳票]"/>
        </MenuItem>

        
        
        
        <MenuItem text="外部システム連動">
            <MenuItem text="SCAW" onClick="COMMAND[SCAW]"/>
            <MenuItem text="DIVA" onClick="COMMAND[DIVA]"/>
        </MenuItem>

        
        
        
        <MenuItem text="マスタメンテ">
            <MenuItem text="ワークフロー取込." onClick="COMMAND[マスタメンテ.ワークフロー取込]"/>
            <MenuItem text="会計関連マスタ" onClick="COMMAND[マスタメンテ.会計関連マスタ]"/>
        </MenuItem>
    </MenuItem>
</TreeMenu>
Linkとしてメニューを表す場合、コンポーネントの制御タグとしてLinkMenuタグを使用します。このタグでは、メニュー項目を縦方向もしくは横方向に展開することが出来ます。MenuItemタグを使用して、メニュー項目と発行イベントを設定しています。
<LinkMenu id="メニューバーリンクメニュー" direction="horizontal" foreground="color:51,51,255">
    <MenuItem text="ヘルプ" onClick="COMMAND[ヘルプ画面起動]"/>
    <MenuItem text="ログアウト" onClick="COMMAND[ログアウト]"/>
</LinkMenu>
command定義
Menuパターンの画面では、基本的に以下の場合の処理をcommandで定義します。

メニュー項目が選択されたときに実行させたい処理

サンプルのArea定義では、各メニュー項目に対応したcommand定義が記述されています。
業務メニューの場合は画面遷移を実行するのが大半で、メニューバーの項目になると画面遷移の他に別の処理を行う場合もあります。

例１：業務メニュー
この例では、全てのメニュー項目が画面遷移の実行メニューになっているので、それぞれのcommand定義内では画面遷移を実行する doTransition命令が使用されています。



<command id="支払入力.ワークフロー取込">
    <doTransition transit="ワークフロー取込クライアントポータルに遷移"/>   
</command>
<command id="支払入力.伝票入力">
    <doTransition transit="伝票入力クライアントポータルに遷移"/>
</command>
<command id="支払処理">
    <doTransition transit="支払処理クライアントポータルに遷移"/>
</command>
<command id="支払照会">
    <doTransition transit="支払照会クライアントポータルに遷移"/>
</command>

<command id="月次処理">
    <doTransition transit="月次処理クライアントポータルに遷移"/>
</command>
<command id="年次処理">
    <doTransition transit="年次処理クライアントポータルに遷移"/>
</command>
例２：メニューバー
この例では、ヘルプ画面の起動とログアウト処理の実行を行っています。
ログアウト処理の実行は、このArea定義にリンク付けている"logout"のContentのログアウトactionを実行し、その後でログイン画面に画面遷移するように定義されています。
<command id="ヘルプ画面起動">
    <doTransition transit="ヘルプ画面起動"/>
</command>
<command id="ログアウト">
    <doAction content="CC_AC_02_Logout" action="ログアウト"/>     
    <doTransition transit="ログイン画面に戻る"/>
</command>

更新情報

最終更新者 : $Author: morishita $

最終更新日時 : $Date:: 2008-08-29 22:48:31 #$

バージョン : $Revision: 2282 $