1. チュートリアル: アプリケーションの構築
  2. タスクの概要ページの開発

9 タスクの概要ページの開発

アプリケーションで追跡されるすべてのプロジェクト作業の幅広く容易にソート可能な概要を提供する、SAMPLE$PROJECT_TASKS表に基づくファセット検索ページを作成します。

このレッスンについて

このレッスンでは、アプリに最終ページ(ファセット検索ページ)を追加します。ファセット検索は、複数の列を含む大きな表をソートするための強力なツールです。

ページの作成ウィザードを使用してページを追加します。ページ・デザイナでのそれ以降のクリーン・アップは最小限であり、使い慣れたものです。

9.1 ファセット検索ページの作成

ファセット検索ページをアプリケーションに追加する手順は、次のとおりです。

  1. アプリケーションのホーム・ページで、「ページの作成」をクリックします。
  2. 「レポート」をクリックします。
  3. 「ファセット検索」をクリックします。
  4. 「ページ属性」で、次のステップを実行します。
    1. ページ番号 - 「8」と入力します
    2. レポート・ページ名 - タスクの概要と入力します
    3. 「次」をクリックします。
  5. 「ナビゲーション・メニュー」で、次のステップを実行します。
    1. 「新規ナビゲーション・メニュー・エントリの作成」を選択します。
    2. 「次」をクリックします。
  6. レポート・ソースの場合:
    1. 「表/ビューの名前」で、「LOV」アイコンをクリックします。
    2. 「SAMPLE$PROJECT_TASKS (表)」を選択します。
    3. ファセットのリストが移入されるのを待ってから次に進みます。
    4. 「作成」をクリックします。
    ウィザードが完了すると、Application Expressはページ・デザイナに「タスクの概要」ページを自動的にロードします。
  7. 「ページの保存と実行」をクリックして、ランタイムにページを表示します。
  8. 完了したら、実行時開発者ツールバーのページ8の編集をクリックしてページ・デザイナに戻ります。

9.2 タスクの概要ページの更新

タスクの概要ページで必要な更新は最小限です。

  • IS_COMPLETE列を更新します。
  • IDおよび監査列を非表示にします(CREATED、CREATED_BY、UPDATED、UPDATED_BY)。
  • START_DATE列とEND_DATE列のセル幅を増やします。
  • 書式マスクをCOST列に適用します。
  • 共有コンポーネントのナビゲーション・メニューの更新

IS_COMPLETE_YN列を更新する手順は、次のとおりです。

  1. 「レンダリング」タブで、「IS_COMPLETE_YN」を選択します。
  2. プロパティ・エディタで、次のように操作します。
    1. ヘッダー: ヘッダー -「Complete」と入力します
  3. 「レンダリング」タブで、「検索結果」(「コンテンツ本体」の下)をクリックします。
  4. プロパティ・エディタで、次のように操作します。
    1. ソース: タイプ - 「SQL問合せ」を選択します。
    2. ソース: SQL問合せ - コンテンツを削除してから、次のコードをコピーして貼り付けます。
      select ID,
       PROJECT_ID,
       MILESTONE_ID,
       NAME,
       DESCRIPTION,
       ASSIGNEE,
       START_DATE,
       END_DATE,
       COST,
       decode(is_complete_yn, 'Y', 'Yes', 'No') IS_COMPLETE_YN,
       CREATED,
       CREATED_BY,
       UPDATED,
       UPDATED_BY
  from SAMPLE$PROJECT_TASKS
    3. 「保存」をクリックします。

列を非表示にするには:

  1. 「レンダリング」タブの「マイルストン」で、「列」を展開します。
  2. [Ctrl]を押しながら次の列をクリックして選択します。
    • CREATED
    • ID
    • CREATED_BY
    • UPDATED
    • UPDATED_BY
  3. プロパティ・エディタで、次のように操作します。
    1. 識別: タイプ - 「非表示列」を選択します。
    2. 「保存」をクリックします。

START_DATEおよびEND_DATE列を更新する手順は、次のとおりです。

  1. 「レンダリング」タブの「列」で、[Shift]を押しながら次の列を選択します。
    • START_DATE
    • END_DATE
  2. プロパティ・エディタで、次のように操作します。
    1. 外観: 書式マスク - DD-MON-YYYYと入力します
    2. 詳細: セルの幅 - 100と入力します。
    3. 「保存」をクリックします。

COSTに書式マスクを適用する手順は、次のとおりです。

  1. 「レンダリング」タブで、「COST」を選択します。
  2. プロパティ・エディタで、次のように操作します。
    1. 外観: 書式マスク - 「LOV」アイコンをクリックします。
    2. $5,234.10を選択します。
    3. 「保存」をクリックします。

タスクの概要ページのナビゲーション・メニュー・エントリを更新する手順は、次のとおりです。

  1. 「共有コンポーネント」アイコンをクリックします。
  2. 「ナビゲーション」で、「ナビゲーション・メニュー」をクリックします。
  3. 「デスクトップ・ナビゲーション・メニュー」をクリックします。
  4. 「タスクの概要」をクリックします。
    「リスト・エントリ」画面が表示されます。
  5. 「エントリ」で、「順序」に80と入力します。
  6. 「イメージ/クラス」に、fa-table-pointerと入力します。
  7. 「変更の適用」をクリックします。
  8. ページ8の編集アイコン(右上)をクリックしてページ・デザイナに戻ります。
  9. 「ページの保存と実行」をクリックします。

    ファセット検索ページは、表のコンテンツをすばやくソートするのに便利です。機能をいくつか試して、ページを確認します。

    • 左側のファセットを選択および選択を解除して、表示の範囲を絞り込みます。
    • 同じカテゴリ内の複数のファセットを選択します。
    • 「クリア」をクリックして、カテゴリ内のすべてのファセットの選択を解除します。

runtime_faceted_search_final.pngの説明が続きます
図runtime_faceted_search_final.pngの説明

ファセット検索ページの「タスクの概要」が完了しました。

お疲れ様でした。アプリケーションが完成しました。