2023年10月7日土曜日

対話モード・レポートの列に星評価を表示する

Oracle APEXではページ・アイテムと対話グリッドの列のタイプに星評価はありますが、対話モード・レポートの列のタイプとして星評価はありません。

Oracle Forumsを探してみると、HTML式とCSSを使った以下の回答を見つけました。

How to Display Star rating in IR?

この回答はテンプレート・ディレクティブが導入される前の実装で、新しく導入されたテンプレート・ディレクティブを使うと、もっと簡単に実装できそうです。

サンプル・データセットのEMP/DEPTに含まれる表EMPをソースとした対話モード・レポートを使って、ジョブがCLERKの従業員の勤続年数を10年単位で星評価してみます。

以下のような表示になります。


表EMPをソースとした対話モード・レポートを含むアプリケーションが作成済みとします。

レポートのソースとなるSELECT文に、勤続年数が10年で1、20年で2、30年で3、、、となる列STARを作成します。

floor((extract(year from sysdate) - extract(year from hiredate)) / 10) star

ソースのSQL問合せは以下になります。
select EMPNO,
       ENAME,
       JOB,
       MGR,
       HIREDATE,
       floor((extract(year from sysdate) - extract(year from hiredate)) / 10) star,
       SAL,
       COMM,
       DEPTNO
  from EMP

この状態でのレポートの表示は以下になります。


星評価なので、表示する星のアイコンを探します。FontAPEXのサイトにアクセスします。


starで検索して見つけた、fa-starのアイコンを使用することにします。

fa-starをクリックして開きます。


アイコンfa-starのHTMLによる記述をコピーします。この文字列は後で使用するため、どこかに記録しておきます。


Oracle APEXのユニバーサル・テーマが提供している色のクラスを確認します。


アイコンの表示色にu-hot-textを使用することにします。


１つの星を表示するHTMLは以下になります。

<span class="fa fa-star u-hot-text" aria-hidden="true"></span>

列STARの列の書式のHTML式として、以下を記述します。



以上で実装は完了です。アプリケーションを実行すると、本記事の先頭にある画像のように対話モード・レポートが表示されます。

今回作成したAPEXアプリケーションのエクスポートを以下に置きました。
https://github.com/ujnak/apexapps/blob/master/exports/sample-ir-star-rating.zip

Oracle APEXのアプリケーション作成の参考になれば幸いです。

完
投稿者 時刻:
ラベル: ,