実行時のビューのカスタマイズ
3 タスク
15 分
シナリオ
GoGoRoadの関係者は、「Enter customer information」ビューと「Identify Location」ビューで、適切な検証を行った上で関連情報のみを表示するように簡素化したいと考えています。 このリクエストに対応するには、「Enter customer information」ビューをカバーする情報を2列レイアウトに変更し、「Identify Location」ビューにZIPコードプロパティを必要なバリデーションを付けて追加します。
以下の表は、チャレンジに必要なログイン情報をまとめたものです。
ロール | ユーザー名 | パスワード |
---|---|---|
アプリケーションデベロッパー | author@gogoroad | pega123! |
補足: 練習環境では、複数のチャレンジの完了をサポートする場合があります。 その結果、チャレンジのウォークスルーに表示される設定は、お客様の環境と完全に一致しない場合があります。
チャレンジ ウォークスルー
詳細なタスク
1 データタイプにプロパティを追加する
- チャレンジのPegaインスタンスに、以下のログイン情報を入力します。
- User nameフィールドに「author@gogoroad」と入力します。
- Password フィールドに「pega123!」と入力します。
- App Studioのナビゲーションペインで次をクリックします:Data.
- Data objects and integrationsランディングページで、「Service address」をクリックしてService addressデータオブジェクトを開きます。
- 「Add field」をクリックして、Service addressデータオブジェクトに新しいフィールドを追加します。
- Field nameフィールドに、「Zip」と入力します。
- Type リストで「Text (single line)」を選択します。
- 「Advanced 」をクリックしてオプションを展開します
- Max lengthフィールドに、「5」と入力します。
- 「Submit 」をクリックして変更を保存します。
2 テンプレートを2列のレイアウトに変更する
- App Studioのナビゲーションペインで、Case Types > Assistance Requestをクリックして、Assistance Requestケースタイプを開きます。
- 「Save and run」をクリックして、ケースインスタンスを作成します。
- Identify issueステップの先に進みます。
- 「Enter customer information」ビューで、「Design」モードを切り替えます。
- 「Enrollment information」セクションにカーソルを合わせてEdit this Sectionをクリックし、「Enrollment information」ペインを開きます。
- 「Enrollment information」パネルで、「Template」の右側にある「Change」をクリックして、テンプレートを変更します。
- Select a templateウィンドウで、「2 Column」をクリックします。
- 「Enrollment information」ペインで、「Coverage level」にカーソルを合わせてクリックし、「Column B」にドラッグします。
- 「Close」をクリックして、「Enrollment information」パネルを閉じます。
- Designモードを切り替えます。
3 コントロール値の設定
- 「Continue」をクリックして、ケースをIdentify locationステップに進めます。
- 「Design」モードを切り替えます。
- 「Service address」アドレスセクションにカーソルを合わせて、Edit this Sectionをクリックします。
- 右側のペインで「Add」アイコンをクリックします。
- 「Fields 」セクションで、Zipフィールドにカーソルを置き、「Add to View」をクリックします。
- 「Close」をクリックして前のペインに戻ります。
- 右側のペインで、Zipにカーソルを合わせ、「Edit this "Text input"」をクリックします。
- 「Use property default」チェックボックスの選択を解除します。
- Label valueフィールドに「Zip code」と入力します。
- Placeholderリストで「Other」を選択します。
- Placeholderリストの下のフィールドで、プレースホルダーの値として「12345」と入力します。
- Requiredリストで、「Always」を選択します。
- Presentationタブをクリックします。
- Editable Settingsセクションで、Min charactersフィールドに「5」と入力します。
- Max charactersフィールドでも手順14を繰り返します。
- Editable FormatセクションのTypeリストで、「Number」を選択します。
- Text alignmentリストで、「Left」を選択します。
- 「Display value using read-only formatting」チェックボックスの選択を解除します。
- 「Apply」をクリックして、変更を保存します。
- 「Close」をクリックして、前のペインに戻ります。
- 「Close」をクリックして、セクションペインを閉じます。
- 「Design」モードを切り替えます。
作業の確認
- マルチステップのナビゲーションメニューで、「Enter customer information」をクリックすると前のステップに戻ります。
- Account IDリストで、登録済みの顧客を選択し、2番目の列に「Coverage level」が表示されることを確認します。
- 「Continue」をクリックして、ケースをIdentify locationステップに移動させます。
- 「Identify location」ビューで、Zip codeフィールドに数字のみを入力できることを確認します。
- Zip codeフィールドに6桁以上の数値を入力して「Continue」をクリックします。
- Zip codeの長さが6桁以上の場合、エラーメッセージが表示されることを確認します。
- Zip codeフィールドに5桁未満の数値を入力して「Continue」をクリックします。
- Zip codeの長さが5桁未満の場合、エラーメッセージが表示されることを確認します。
- Zip codeフィールドに5桁の数値を入力して「Continue」をクリックします。
- ケースがIdentify vehicleステップに進むことを確認します。
このチャレンジは、下記のモジュールで学習したことを実践するための内容です。
このモジュールは、下記のミッションにも含まれています。
トレーニングを実施中に問題が発生した場合は、Pega Academy Support FAQsをご確認ください。