$p.events.on_crosstab_load

/**
 * ================================================================
 * サンプル  クロス集計で、工数の上限を超えたセルを色で強調する
 * ================================================================
 *
 * 【概要】
 *   作業日報をクロス集計で「担当者×月」の工数合計として表示するとき、
 *   各セルの値を読み、月の上限（例：45時間）を超えたセルを赤、
 *   上限の8割以上のセルを黄色で塗ります。セルにマウスを乗せると
 *   「上限45時間に対し50時間」のように表示します。
 *   $p.events.on_crosstab_load は、クロス集計を開いたときだけでなく、
 *   前後の期間への移動や、行・列などの設定を変えて描き直すたびに発火します。
 *   描き直すと色は消えるため、発火のたびに付け直します。
 *
 * 【前提】
 *   クロス集計の設定：行＝担当者、列＝作業日（期間：月次）、
 *   集計種別＝合計、値＝工数（数値項目）。
 *   集計種別が「件数」など合計以外のときも同じように色を付けるため、
 *   上限の値はその集計に合わせて決めてください。
 *
 * 【スクリプトの出力先】
 *   「クロス集計」にチェックしてください。一覧画面からビューの切り替えで
 *   クロス集計にする使い方もする場合は「一覧」にもチェックしてください
 *   （ビューの切り替えでは画面が読み込み直されず、一覧画面で読み込んだ
 *   スクリプトのまま動くため）。
 * ================================================================
 */

// ===== 設定 =====
// 月の上限（時間）
const MONTHLY_LIMIT = 45;
// 上限に対してこの割合以上なら注意の色にする
const WARNING_RATIO = 0.8;
// セルの背景色
const OVER_COLOR = '#ffc7c7'; // 上限超え
const WARNING_COLOR = '#fff2b3'; // 上限の8割以上

// ===== 処理 =====
// セルの値を数値で読む。
// セルには「集計値の文字」のあとに棒グラフ（svg）が続くことがあるため、
// セル全体の文字ではなく、最初の文字のかたまりだけを読む。
// 桁区切りのカンマは取り除く。値が無いセルは null を返す。
function readCellValue($cell) {
    const textNode = $cell.contents().filter(function () {
        return this.nodeType === Node.TEXT_NODE && this.nodeValue.trim() !== '';
    })[0];
    if (!textNode) {
        return null;
    }
    const value = Number(textNode.nodeValue.replace(/,/g, '').trim());
    return isNaN(value) ? null : value;
}

// クロス集計を開いたとき、期間の移動や設定の変更で描き直すたびに呼ばれる
$p.events.on_crosstab_load = function () {
    // 本体の行（tr.crosstab-row）の td だけを対象にする。
    // 列の見出し（thead th）と、行の見出し（行の先頭の th。「担当者 : 合計」の形）は
    // 合計を表すので対象にしない
    $('#CrosstabBody tr.crosstab-row > td').each(function () {
        const $cell = $(this);
        const value = readCellValue($cell);
        if (value === null) {
            return;
        }
        let color = '';
        if (value > MONTHLY_LIMIT) {
            color = OVER_COLOR;
        } else if (value >= MONTHLY_LIMIT * WARNING_RATIO) {
            color = WARNING_COLOR;
        }
        if (color) {
            $cell
                .css('background-color', color)
                .attr('title', `上限${MONTHLY_LIMIT}時間に対し${value}時間`);
        }
    });
};