カスタマイズ kintone 初心者向け : 他のアプリのレコードを複数取得

チュン

こんにちは！ 私の名前はチュンです。
株式会社メディアフュージョンでkintone関連製品の開発を担当しているベトナム出身のエンジニアです。
kintoneに興味のある方、kintoneを使っている方に私の蓄積した経験を共有したいと思います。

kintoneの標準機能には、異なるアプリ間でデータを参照するためには、ルックアップまたは関連レコード一覧のみ用意されています。
ルックアップでは他のアプリケーションにあるレコードを１レコードのみ、手動で参照するしかできません。関連レコード一覧では複数のレコードのデータを参照できますが、参照したデータの表示のみ可能で、参照したレコードに計算等の処理を行うことはできません。
もし複数のレコードのデータを自動的に参照して、得られたデータに対して計算などの処理を自動的にしたい場合は、どうするか？
この記事では、JavaScriptを使って問題を解決する方法を説明します。

問題
各従業員の月給を、勤務時間と時給の値に基づいて計算します。
kintoneで以下3つのアプリを使用しています :

• 人事情報管理アプリでは、社員番号、氏名、時給などの社員情報を管理します。1レコードは各社員の情報を表します。
• 勤怠管理アプリでは、社員ごとの日々の労働時間を管理します。1レコードは各社員の1日の労働時間を表します。
• 給与計算アプリでは、社員ごとの月給を計算します。1レコードは各社員の1ヶ月の給与を表します。

給与計算アプリでは、ある月の社員の給与を計算するために、その月の勤怠データと、その社員の給与データを参照する必要があります。

kintoneの標準機能で給与データを抽出するには、ルックアップ機能を使用します。しかし、1ヶ月の勤怠データを抽出するには、ルックアップ機能は使用できません。ルックアップ機能は1レコードのデータしか取得できないからです。関連レコード一覧機能では、データを閲覧することはできますが、データをコピーして利用することはできません。

そのため、JavaScriptでカスタマイズし、複数のレコードからデータを取得して計算する必要があります。

準備アプリ
人事情報管理アプリのフィールドです。

勤怠管理アプリのフィールドです。

給与計算アプリのフィールドです。

JavaScriptプログラム
※ 給与計算アプリは、JavaScriptを使って計算を行っています。
※「JSEdit for kintone」プラグインを使用して、ソースコードを編集します。 JSEdit for kintone の画面から jQuery と moment ライブラリを追加し、インストールすることで、HTML 要素のコーディングや時間の処理がより簡単になります。
プログラムの処理流れ
1. レコードのインターフェースに「計算」ボタンを作成します。
2. 「 計算」ボタンをクリックすると、以下の処理を実行します。
チェック
月、年、社員コードが入力されていない場合 : 何もしません。
逆の場合
　　勤怠管理アプリから、社員コードが選択した社員コードに一致し、出勤日が入力した年月に含まれるレコードを取得します。
　　取得したレコードから、総労働時間を計算します。
　　計算した総労働時間を「総勤務時間」フィールドに設定します。
　　「給与」フィールドの値は、「時間給」×「総勤務時間」の計算式によって自動的に算出されます。

(() => {
  'use strict';
  kintone.events.on([
    // 計算機能は、レコードの新規作成画面と編集画面の両方で有効になります。
    'app.record.create.show',
    'app.record.edit.show'
  ], (event) => {
    // 「calculateButtonContainer」 要素のHTML要素を格納するための変数「container」を初期化します。
    let container = jQuery('#user-js- calculateButtonContainer')

    // 計算ボタンのHTML要素を格納するために、「calculateButton」変数を初期化します。
    let calculateButton = jQuery('<button style="background: #4CAF50; color: white; border: none; padding: 7px 20px; border-radius: 8px; margin-top: 33px">計算</button>');

    // 計算ボタンをレコード画面に追加します。
    container.append(calculateButton);

    // 計算ボタンがクリックされた後のイベント処理
    calculateButton.on('click', function() {
      // レコードのデータを格納するために、「record」変数を初期化します。
      let record = kintone.app.record.get().record;
      
      // 入力された月の値を格納するために、「month」変数を初期化します。
      let month = record['月'].value;
      
      // 入力された年の値を格納するために、「year」変数を初期化します。
      let year = record['年'].value;
      
      // 選択された社員コードの値を格納するために、「employee」変数を初期化します。
      let employee = record['社員コード'].value;
      
      // ユーザーが月、年、社員コードを入力していない場合、処理を中止します。
      if (!month || !year || !employee) return;
      
      // 月の初日の日付を格納するために、「startDateOfMonth」変数を初期化します。
      let startDateOfMonth = moment(`${year}-${month}-01`).startOf('month').format('YYYY-MM-DD');
      
      // 月の最終日の日付を格納するために、「endDateOfMonth」変数を初期化します。
      let endDateOfMonth = moment(`${year}-${month}-01`).endOf('month').format('YYYY-MM-DD');
      
      // API呼び出しのためのパラメータを格納するために、「params」変数を初期化します。
      const params = {
        app: 815, // 勤怠管理アプリのID
        query: `社員コード = "${employee}" and 出勤日 >= "${startDateOfMonth}" and 出勤日 <= "${endDateOfMonth}"` // 社員コードが選択した社員コードと一致し、出勤日が指定した月に含まれるレコードを検索
      };
      
      // kintone REST APIを使用して、条件に一致するレコードを取得します。
      kintone.api(kintone.api.url('/k/v1/records.json', true), 'GET', params, function(result) {
        // 合計勤務時間を格納するために、「total」変数を初期化します。
        let total = 0;
        
        // 取得したレコードをループして、勤務時間の合計を計算します。
        for (let record of result.records){
          total += (+record['勤務時間'].value);
        }
        // 合計勤務時間を「総勤務時間」フィールドに設定します。
        record['総勤務時間'].value = total;
        kintone.app.record.set({record: record});
      });
    });
    return event;
  });
})();

結果

参照 
複数のレコードを取得する

記事を読んでいただきありがとうございます。
次の記事をお楽しみにお待ちください !