IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

39
© 2012 IBM Corporation IBM SmarterCloud Control Desk 7.5 新新新新新新 UI 新新新 2012/04/13 新新新新 新新新 新新新新新新 ・・

description

2012/04/13 日本アイ・ビー・エム株式会社. IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化. 本書について. 本書では、 ISCCD7.5 ( Maximo 7.5 )で強化もしくは新たに追加された UI 機能について解説します。 また以下の機能については有効 / 無効の切り替えおよび各種設定の変更手順を示します。 非同期バリデーション クライアント・サイド・バリデーション ナビゲーション 新規レコード作成ダイアログ - PowerPoint PPT Presentation

Transcript of IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

Page 1: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

© 2012 IBM Corporation

IBM SmarterCloud Control Desk 7.5  

新機能ガイド -  UI の強化

2012/04/13

日本アイ・ビー・エム株式会社

Page 2: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation2

本書について

本書では、 ISCCD7.5 ( Maximo 7.5 )で強化もしくは新たに追加された UI 機能について解説します。

また以下の機能については有効 / 無効の切り替えおよび各種設定の変更手順を示します。– 非同期バリデーション– クライアント・サイド・バリデーション– ナビゲーション– 新規レコード作成ダイアログ

※上記の機能を全て無効に設定すると、旧バージョンの Maximo( 7.1、 7.2)の UIに戻すことができます。

Page 3: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation3

目次

非同期バリデーション– 概要– 機能の有効化 / 無効化による表示の違い

クライアント・サイド・バリデーション– 概要– 機能の有効化 / 無効化による表示の違い

ナビゲーション– 概要– 機能の有効化 / 無効化による表示の違い

新規レコード作成ダイアログ– 概要– 機能の有効化 / 無効化による表示の違い

その他の UI 機能– 仕様ウィジェット– リフレッシュ・ボタン– リッチ・テキスト・コントロール

設定の変更手順– システム全体の設定– システム・プロパティの変更手順– アプリケーション単位での設定– フィールド単位での設定– アプリケーション定義 XML の変更手順

Page 4: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation4

これまでタブアウト時に同期実行されていたフィールドの評価が非同期になりました。このため、タブアウトし制御がブラウザーに戻った瞬間に評価結果が出ず遅れて表示される事がありますが、制御が戻る時間が早くなったためユーザーの全体の待ち時間が大幅に短縮されます。

チェック結果は各項目やその項目があるタブにアイコンで表示されるため、これまでの用にエラー・ワーニングがあることがわかってもそれがどこかわからないと言うことが激減します。また、アイコンをクリックすることでエラー内容が確認できます。

この非同期 Validation はアプリケーション・項目・サーバー全体で On/Off 可能です。

将来的には、 Validation をユーザーにて設定すること機能を搭載する予定です。

エラー時にはすべての項目がダイアログで表示されます。

非同期バリデーション - 概要

Page 5: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation5

非同期バリデーション - 機能の有効化 / 無効化による表示の違い

有効• 入力された値が見つからない場合、入力フィールド、セクシ

ョンおよびタブにエラー・アイコンが表示される• 入力フィールドのエラー・アイコンにマウス・カーソルを乗

せると、エラーの詳細がポップアップ表示される• これらの処理は非同期に実行され、ユーザーは入力値を保持

したまま、他のフィールドへの値の入力を続行できる。

無効• 入力された値が見つからない場合、値の選択ダイアログがポ

ップアップ表示される• これらの処理は同期実行され、ユーザーが他のフィールドへ

の入力を続行するには、入力値を一旦クリアしなければならない。

Page 6: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation6

これまでサーバー側で実行していたデータの有効性チェック(データ型やサイズの検証)を、ブラウザ側で実行することができるようになりました。ブラウザ側の負荷が若干あがりますが、入力の都度サーバーとの通信を行う必要がなくなり、ネットワーク・トラフィックを大幅に削減することが可能です。

また、自動入力プロパティーを構成することで、インクリメンタル検索やユーザーが他のフィールドに入力したデータに基づいて、フィールドにデータを取り込むことが可能です。構成可能なプロパティは以下の 3 つです。

– 先行入力インクリメンタル検索機能のこと。フィールドにデータを入力していくと、そのデータに対する1 つ以上の一致候補が一覧表示される。

– 値の選択あるフィールドでユーザーが入力したデータが他のフィールドに取り込まれるようにする。

– フィルターユーザーに提示する先行入力の選択項目を制限する。

クライアント・サイド・バリデーション - 概要

先行入力:一致候補の一覧表示

※クライアント・サイド・バリデーション機能を有効化するには、非同期バリデーションが有効であることが前提となります。

Page 7: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation7

クライアント・サイド・バリデーション - 機能の有効化 / 無効化による表示の違い 

有効• 自動入力プロパティーを構成したフィールドに値を入力する

と、フィールドにキャッシュされたデータをからインクリメンタル検索を実行し、入力値に該当する値の候補をドロップダウン・リストで表示する(先行入力)

• 入力の途中で他のフィールドにフォーカスを移した場合は、候補の中から値が自動入力される

• 上記の処理は、サーバーでの有効性チェックの前に、クライアント・ブラウザーで実行される

無効• 自動入力プロパティーを構成したフィールドに値を入力して

も、値の候補は表示されない• 入力の途中で他のフィールドにフォーカスを移した場合は、

Smart Fill アイコンが表示され、クリックすると入力値に該当する値の候補から、値を選択することができる

• 上記の処理は、常にサーバー・サイドで実行される

他のフィールドにフォーカス

他のフィールドにフォーカス

Page 8: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation88

What‘s New? #1 – ヘッダー・バー

新しいホーム・アイコンでどこからでもスタート・センターに移動可能です。 リンク先メニューはホーム・アイコンの右に移動し、ドロップ・ダウン・ボタンとなりました。

ホーム・アイコンとリンク先メニュー・アイコンにツール・チップにて説明が表示されます。 リンク先メニューの 1番上にスタート・センターへのリンクが作成されました。

アプリケーション間の移動の簡略化 これまでの問題点 :

– リンク先メニューでアプリケーションが見つけにくく、アプリケーション間の移動が煩雑である。

– 保存されたクエリやアクション・メニューが重要であるにもかかわらず、アクセスが煩雑である。

– 標準の UI が複雑である。– リスト・タブとそのほかのタブの関係性

ナビゲーション - 概要1

Page 9: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation9

画面の左側にナビゲーション・バーが追加されました。 3 つのスタイルがあります。

– 1) ツールバー付アプリケーション– 2) ツールバー無しアプリケーション– 3) ナビゲーション・バーの無いアプリケーション

常にアプリケーションの左側に表示されます。(標準でナビゲーション・バーがオフのアプリケーションは除く )

ナビゲーション・バーの表示状態は保持されず、アプリケーションを開いた際には常に標準状態でナビゲーション・バーが表示されます。

ナビゲーション・バーは閉じることが出来ます。

ナビゲーション - 概要 2

What‘s New? #2 – ナビゲーション・バー

Page 10: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation10

What‘s New? #3 リストタブの廃止

アプリケーションを開いた際にリストタブが表示されなくなり、リストへのリンクが”パンくずリスト”として表示されるようになりました。

水平方向スクロールを最小限にする為に、ラベルはそのコンポーネントの上に移動されました。

What‘s New? #4 ラベルの配置変更

ナビゲーション - 概要3

Page 11: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation11

ナビゲーション - 機能の有効化 / 無効化による表示の違い1

有効• 「リンク先」、「スタート・センター」へのリンクがヘッダー・バーの左端に移動し、アイコンとして表示される

無効• 「リンク先」、「スタート・センター」へのリンクがヘッダー・バーの中央にテキストとして表示され

ヘッダー・バー

Page 12: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation12

ナビゲーション - 機能の有効化 / 無効化による表示の違い2

有効• 画面左側にナビゲーション・バーが表示される• アプリケーション単位で表示 / 非表示を設定している場合は、

システム・プロパティの設定は適用されない(後述)

無効• コンテンツが画面全体に表示される• アプリケーション単位で表示 / 非表示を設定している場合は、

システム・プロパティの設定は適用されない(後述)

ナビゲーション・バー

Page 13: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation13

ナビゲーション - 機能の有効化 / 無効化による表示の違い3

有効• アプリケーションにリストタブが表示されず、リストへのリンクがパンくずリストとして表示される

無効• アプリケーションにリストタブが表示され、パンくずリストは表示されない

リストタブ

Page 14: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation14

機能の有効化 / 無効化による表示の違い - ナビゲーション4

有効• ラベルが入力フィールドの上段に表示される

無効• ラベルが入力フィールドの左側に表示される

ラベルの表示位置

Page 15: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation15

新規レコード作成の簡略化 これまでの問題点 :

– インシデント、サービス要求、変更のレコードを新規に作成する際、表示される項目が多く、どのフィールドに入力するべきか分かりづらい(特に新しいユーザー)

解決策 :– 新規レコードの作成時に入力すべき項目を明らかにし、ユーザーが最小限の入力でレ

コードを作成できるようにする インシデント、サービス要求、変更のレコードを新規作成すると、新規レコード作成ダイ

アログがポップアップ表示される

新規レコード作成ダイアログ - 概要

インシデント サービス要求 変更

Page 16: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation16

新規レコード作成ダイアログ - 機能の有効化 / 無効化による表示の違い

有効• インシデントの新規レコードを作成すると、入力フィールド

を持つダイアログが表示される• ダイアログの入力フィールドに値を入力して「今すぐ送信」

ボタンをクリックすると、入力値を反映した状態で新規レコードが作成される(この時点で保存される)

無効• インシデントの新規レコードを作成すると、初めからインシ

デント・アプリケーションの画面が表示される。• この時点ではまだレコードは作成されておらず、値を入力後「保存」ボタンをクリックしてレコードを保存する必要がある

インシデント

Page 17: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation17

新規レコード作成ダイアログ - 機能の有効化 / 無効化による表示の違い

有効• サービス要求の新規レコードを作成すると、入力フィールド

を持つダイアログが表示される• ダイアログの入力フィールドに値を入力して「今すぐ送信」

ボタンをクリックすると、入力値を反映した状態で新規レコードが作成される(この時点で保存される)

無効• サービス要求の新規レコードを作成すると、初めからサービ

ス要求アプリケーションの画面が表示される。• この時点ではまだレコードは作成されておらず、値を入力後「保存」ボタンをクリックしてレコードを保存する必要がある

サービス要求

Page 18: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation18

新規レコード作成ダイアログ - 機能の有効化 / 無効化による表示の違い

有効• 変更の新規レコードを作成すると、入力フィールドを持つダ

イアログが表示される• ダイアログの入力フィールドに値を入力して「今すぐ送信」

ボタンをクリックすると、入力値を反映した状態で新規レコードが作成される(この時点で保存される)

無効• 変更の新規レコードを作成すると、初めからサービス要求ア

プリケーションの画面が表示される。• この時点ではまだレコードは作成されておらず、値を入力後「保存」ボタンをクリックしてレコードを保存する必要がある

変更

Page 19: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation1919

これまで値を保持するために 3 つの異なったフィールドを使用していましたが、これらを 1 つのフィールドを使用する様に変更しました。

下記のアプリケーションで変更が適用されています :

– 変更 , 構成アイテム , 資産 , ロケーション , セルフ・サービス・センター , インシデント , 問題 , アクティビティ , 現状の構成アイテム , サービス要求の作成 , 請求書 , 部品マスター , 資産テンプレート , オファリング , 注文書 , 購買要求書 , リリース , ソリューション , サービス要求 , チケット・テンプレート , 作業指示書管理

その他の UI 機能 - 仕様ウィジェット

Page 20: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation2020

これまで TPM系製品にあったテーブルにリフレッシュボタンが標準装備されました。

テーブルコンポーネントへの標準装備であるため、 TPAE 内すべてのアプリケーションで使用可能になっています。

その他の UI 機能 - リフレッシュ・ボタン

Page 21: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation2121

Long Description と通信テンプレートにリッチテキストコントロールが採用されました。これにより文字のサイズの変更から画像の挿入等、自由に装飾を施した文章を記録に残す事が可能になります。

スクリプト等問題を起こす可能性のある内容は保存時に削除されます。

その他の UI 機能 - リッチ・テキスト・コントロール

Page 22: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation22

設定の変更手順 - システム全体の設定

UI 機能の設定変更をシステム全体に適用するためには、 Maximo のシステム・プロパティを変更します。

以下の機能を対象とし、システム・プロパティの設定変更手順を示します。– 非同期バリデーション– クライアント・サイド・バリデーション– ナビゲーション– 新規レコード作成ダイアログ

※上記の機能を全て無効に設定すると、旧バージョンの Maximo( 7.1、 7.2)の UIに戻すことができます。

Page 23: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation23

設定の変更手順 - 各機能のプロパティ1 UI 機能の設定変更をシステム全体に適用するためには、 Maximo のシステム・プロパティを変更します。 各機能ごとに、以下のプロパティを変更できます。

プロパティー名 説明 デフォルト値mxe.webclient.async 非同期バリデーションが有効かどうかを示します。個別に有効 / 無効が設定さ

れているアプリケーションおよびフィールドにはこの設定は適用されません。0 :無効、 1 :有効

1

mxe.webclient.asyncerrortooltipwaitbeforeopen

マウスをエラー・アイコン上に置いたときに、エラー・ツールチップ・ダイアログが開くまで待機する期間 (秒数 ) 。

2

mxe.webclient.asyncrendertimelimit

フレームワークが複数の非同期要求を処理しているときに、クライアントに送信される応答と応答の間の最大秒数

15

mxe.webclient.asyncrequestsbeforerender

応答をレンダリングするまでに、フレームワークが処理する並行非同期要求の最大数

5

非同期バリデーション

プロパティー名 説明 デフォルト値mxe.webclient.ClientDataValidation

クライアント・サイド・バリデーションを有効にします。0 :無効、 1 :有効

1

mxe.webclient.ClientEventQueue.threshold

サーバーへ送信する前にクライアント・イベント・キューに入れることができるイベントの最大数

1

mxe.webclient.ClientEventQueue.timeout

クライアント・イベント・キューがサーバーへの送信までに待機する最大時間 (ミリ秒 ) 。

3000

クライアント・サイド・バリデーション

Page 24: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation24

設定の変更手順 - 各機能のプロパティ2ナビゲーション

新規レコード作成ダイアログ

プロパティー名 説明 デフォルト値mxe.webclient.homeButtonHeaders

ヘッダー・バーの設定。有効にすると、「リンク先」メニューを画面の左側に移動し、「スタート・センター」ボタンをヘッダーに追加します。0 :無効、 1 :有効

1

mxe.webclient.systemNavBar ナビゲーション・バーの設定。有効にすると、画面左側にナビゲーション・バーが表示される。個別に表示 / 非表示が設定されているアプリケーションにはこの設定は適用されません。0 :無効、 1 :有効

1

mxe.webclient.tabBreadCrumbs リストタブの非表示設定。有効にすると、アプリケーションの一覧タブが非表示になり、代わりに画面上部にリストへのリンク(パンくずリスト)が表示されます。0 :無効、 1 :有効

1

mxe.webclient.verticalLabels 各入力フィールドのラベルの表示位置の設定。有効にすると、ラベルがフィールドの上部に表示され、無効にすると左側に表示されます。0 :無効、 1 :有効

プロパティー名 説明 デフォルト値pmsrv.servicerequest.usecreatedialog

サービス要求のレコードを新規に作成する際、ダイアログを使用する。0 :無効、 1 :有効

1

pminc.incident.usecreatedialog インシデントのレコードを新規に作成する際、ダイアログを使用する。0 :無効、 1 :有効

1

pmchg.change.usecreatedialog 変更のレコードを新規に作成する際、ダイアログを使用する。0 :無効、 1 :有効

1

Page 25: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation25

設定の変更手順 - システム・プロパティの変更方法1 「システムの構成」→「プラットフォームの構成」→「システムのプロパティ」を選択

Page 26: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation26

設定の変更手順 - システム・プロパティの変更方法2① グローバル・プロパティの「フィルター」をクリックし、検索欄を表示② 変更したいプロパティを検索(ここでは mxe.webclient.systemNavBar を検索)③ プロパティ名の左側にあるアイコンをクリック④ グローバル値を変更( 1→0 )⑤ ツールバーの「保存」ボタンをクリックし、変更を保存

②③

Page 27: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation27

設定の変更手順 - システム・プロパティの変更方法3① 変更したプロパティ名の左側にあるチェックボックスを選択② ツールバーの「実行中のリフレッシュ」ボタンをクリック

Page 28: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation28

設定の変更手順 - システム・プロパティの変更方法4

選択したプロパティ名がリストされていることを確認し、「 OK」ボタンをクリック

Page 29: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation29

設定の変更手順 - システム・プロパティの変更方法5

一度ログアウトし、再度ログインして変更が反映されていることを確認

Page 30: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation30

設定の変更手順 - アプリケーション単位での設定 以下の機能については、アプリケーション単位で有効 / 無効を設定することができます。

– 非同期バリデーション– ナビゲーション・バー

アプリケーション単位で設定した内容は、システム・プロパティの設定より優先されます。 設定を変更するには、変更を適用したいアプリケーションの定義 XML ファイルをエクスポ

ートし、 presentation タブにそれぞれ以下の属性を追加します。機能名 変更対象タブ 追加する属性名 属性値

非同期バリデーション presentation synchronous true  : 同期false  : 非同期

ナビゲーション・バー presentation systemnav true  : 表示false  : 非表示

Page 31: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation31

設定の変更手順 - 入力フィールド単位での設定

以下の機能については、入力フィールド単位で有効 / 無効を設定することができます。– 非同期バリデーション

入力フィールド単位で設定した内容は、システム・プロパティおよびアプリケーションの設定より優先されます。

設定を変更するには、変更を適用したい入力フィールドが含まれているアプリケーションの定義 XML ファイルをエクスポートし、変更する入力フィールドを定義しているタブに以下の属性を追加します。

機能名 変更対象タブ 追加する属性名 属性値非同期バリデーション 変更する入力フィー

ルドを定義しているタブ

synchronous true  : 同期false  : 非同期

Page 32: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation32

設定の変更手順 - アプリケーション定義 XML の編集方法1 「システムの構成」→「プラットフォームの構成」→「アプリケーション・デザイナー」を選択

Page 33: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation33

設定の変更手順 - アプリケーション定義 XML の編集方法2

設定を変更するアプリケーションを検索し、選択(ここではサービス要求アプリケーションを選択)

Page 34: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation34

設定の変更手順 - アプリケーション定義 XML の編集方法3

ツールバーの「アプリケーション定義のエクスポート」ボタンをクリック

Page 35: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation35

設定の変更手順 - アプリケーション定義 XML の編集方法4 XML ファイルが新規ウィンドウで開かれるので、「ファイル」→「名前を付けて保存」を選択して、任意の場所に保存

Page 36: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation36

設定の変更手順 - アプリケーション定義 XML の編集方法5 任意のテキスト・エディターでファイルを開き、設定を変更して保存(ここではナビゲーション・バーを

非表示に設定、その他の設定方法は本資料の P19 、 P20 を参照)

Page 37: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation37

設定の変更手順 - アプリケーション定義 XML の編集方法6 再度アプリケーション・デザイナーで XML をエクスポートしたアプリケーションを開く ツールバーの「アプリケーション定義 XML のインポート」を選択

Page 38: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation38

設定の変更手順 - アプリケーション定義 XML の編集方法7

編集した XML ファイルを指定し、「 OK」ボタンをクリック

Page 39: IBM SmarterCloud Control Desk 7.5 新機能ガイド -  UI の強化

©2012 IBM Corporation39

設定の変更手順 - アプリケーション定義 XML の編集方法8 変更した内容が正しく反映されていることを確認し、ツールバーの「保存」ボタンをクリックして変更を

保存