レコード詳細画面の表示後イベント(app.record.detail.show)での値のセットについて

いつも大変お世話になっております。

【顧客情報照会】と【機器情報マスター】という2つのアプリがあります。
【顧客情報照会】一覧画面で「レコードの詳細を表示する」ボタンをクリック後、レコードの詳細画面が表示されサブテーブルに【機器情報マスター】の値をセットしたいです。

開発者ツールで見る限りは値は取得できていたのですが、表示されませんでした。
値は取得できているが、画面にセット(表示?)されていないようです。

画面が変わらないせいかと思いlocation.reload();で再読み込みをしてみたのですが、
画面が永遠に更新されてしまいうまくできませんでした。

どなたか分かる方いらっしゃいましたらご教授いただければ幸いです。
よろしくお願いいたします。

(() => {
'use strict';
  //レコードの詳細画面表示後に実行
  kintone.events.on(
    'app.record.detail.show',(event) => {
      //イベントを行うレコード取得
      const record = event.record;
      const lookData = record.得意先コード.value;
      
      //機器情報マスターのアプリID
      const appId = 14;
      const body = {
        "app": appId,
        "query": '得意先コード = "' + lookData + '"'
      };
      let subRow = [];
      kintone.api(kintone.api.url('/k/v1/records.json', true), 'GET', body, (resp) => {
        for (let i = 0; i < resp.records.length ; i++){
          //複合機は表示しない。
          let num = resp.records[i]['得意先枝番'].value;
          if (num > '09'){
            console.log(resp.records);
            subRow[i]  = {
              value:{
                '機器情報_枝番':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['得意先枝番'].value
                },
                '機器情報_物件':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['物件'].value
                },
                '機器情報_型番':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['型番'].value
                },
                '機器情報_IPアドレス':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['IPアドレス'].value
                },
                '機器情報_導入日':{
                  type:'DATE',
                  value:resp.records[i]['導入日'].value
                },
                '機器情報_保守':{
                  type:'CHECK_BOX',
                  value:resp.records[i]['保守'].value
                },
                '機器情報_備考':{
                  type:'MULTI_LINE_TEXT',
                  value:resp.records[i]['備考'].value
                },
                '機器情報_ユーザーID':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['ユーザーID'].value
                },
                '機器情報_パスワード':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['パスワード'].value
                },
                '機器情報_機器id':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['機器id'].value
                },
              }
            };//if end
          }//for end
          event.record.導入機器一覧.value.push(subRow);
        }//api end
        console.log(record.導入機器一覧.value);
        var rec = kintone.app.record.get();
        rec.record.導入機器一覧.value= subRow;
        kintone.app.record.set(rec);
      }, (error) => {
        // error
        console.log(error);
      });
    return event;
  }); //event end
    
})(); //function end

detail.showイベントではevent.recordを書き換えることはできません。

同じことを行う場合、REST APIでレコードの更新 をする必要があります。

同様の質問に回答した時の記録 があるので、参考になれば幸いです。

mls-hashimoto様

コメントありがとうございます。
お返事遅くなり申し訳ございません。

app.record.detail.showではできないこと知らなかったためとても勉強になりました。
ありがとうございます。

掲載してくださった記事をもとに更新をしてみたのですがlocation.reload();のせいかずっと画面がパカパカしてreload();してしまいます。
データ自体はセットされていたため更新は無事にできているみたいです。

書く場所が違うのでしょうか?
いろいろな記事を見ながら書き換えてみたのですが、書き方があっているかも良く分からない状態です。

未熟者のためご指導ご鞭撻のほどよろしくお願いしたいです。
お忙しいところ恐縮ですが何卒よろしくお願いいたします。

(() => {
'use strict';
 //レコードの詳細画面表示後に実行
  kintone.events.on(
    'app.record.detail.show',(event) => {
      //イベントを行うレコード取得
      const record = event.record;
      const lookData = record.得意先コード.value;
      
      //機器情報マスターのアプリID
      const appId = 14;
      const body = {
        "app": appId,
        "query": '得意先コード = "' + lookData + '"'
      };
      //現在のレコードのIDとアプリのID
      const recordId = event.recordId;
      const eveAppId = event.appId
      const bodyP = {
        'app': eveAppId,
        'id': recordId,
          'record': {
            '導入機器一覧': {
              'value':[]
            },
            '複合機': {
              'value':[]
            },
          }
      };
      let subRow = {};
      //let subRowArr = [];
      let subRow2 = {};
      //let subRow2Arr = [];
      let d = 0;
      let f = 0;
      
      kintone.api(kintone.api.url('/k/v1/records.json', true), 'GET', body, (resp) => {
        for (let i = 0; i < resp.records.length ; i++){
          //複合機は表示しない。
          let num = resp.records[i]['得意先枝番'].value;
          if (num > '09'){
            subRow[d]  = {
              value:{
                '機器情報_枝番':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['得意先枝番'].value
                },
                '機器情報_物件':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['物件'].value
                },
                '機器情報_型番':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['型番'].value
                },
                '機器情報_IPアドレス':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['IPアドレス'].value
                },
                '機器情報_導入日':{
                  type:'DATE',
                  value:resp.records[i]['導入日'].value
                },
                '機器情報_保守':{
                  type:'CHECK_BOX',
                  value:resp.records[i]['保守'].value
                },
                '機器情報_備考':{
                  type:'MULTI_LINE_TEXT',
                  value:resp.records[i]['備考'].value
                },
                '機器情報_ユーザーID':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['ユーザーID'].value
                },
                '機器情報_パスワード':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['パスワード'].value
                },
                '機器情報_機器id':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['機器id'].value
                },
              }
            };//subRow end
            bodyP.record.導入機器一覧.value.push(subRow[d]);
            d = d + 1;
          }else{
            subRow2[f]  = {
              value:{
                '複合機_枝番':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['得意先枝番'].value
                },
                '複合機_機種名':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['機種名'].value
                },
                '複合機_導入日':{
                  type:'DATE',
                  value:resp.records[i]['導入日'].value
                },
                '複合機_使用場所':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['使用場所'].value
                },
                '複合機_機器id':{
                  type:'SINGLE_LINE_TEXT',
                  value:resp.records[i]['機器id'].value
                },
              }
            }
            bodyP.record.複合機.value.push(subRow2[f]);
            f = f + 1;
          }  //if end
        }//for end
        kintone.api(kintone.api.url('/k/v1/record', true), 'PUT', bodyP, (resp) => {
         location.reload();
        }, (error) => {
         alert(JSON.stringify(error));
        });
      }, (error) => {
        // error
        console.log(error);
      });
    }); //event end

})(); //functio end

奥田 帆乃果 さま

APIの処理は合っています。延々とリロードされてしまうのは、レコードを開く度に「REST APIを実行し、成功してlocation.reload()を行う」動作を繰り返しているためです。

どこかでAPIを実行する条件(実行しない条件)を追加する必要があります。以下3通りほどあります。

①サブテーブルの1行目に値が含まれていれば実行しない

    'app.record.detail.show',(event) => {
        const record = event.record;

      if (record['導入機器一覧'].value[0]?.value['機器情報_枝番'].value || record['複合機'].value[0]?.value['複合機_枝番'].value) return event;

以上のようにどちらかのサブテーブルの1行目に値があればreturn eventで以降の処理をさせないようにすることができますが、一度しか更新しなくなります(再度更新させたい場合はレコードの編集からサブテーブルの値を全て削除すれば可能です)。

 

②更新する値と現在のレコードの値を比較

          }//for end

          let recordData = kintone.app.record.get(), rec = recordData.record;
        let isChange = Object.keys(bodyP.record).some((table) => {
          if (bodyP.record[table].value.length !== rec[table].value.length) return true;

          return bodyP.record[table].value.some((row, index) => {
            return Object.keys(rec[table].value[0].value).some((field) => row.value[field].value !== rec[table].value[index].value[field].value)
          });
        });

          if (isChange) {
          kintone.api(...
          }

以上のような方法で比較できます。①の方法とは違い、更新する必要のある場合のみ更新される形になります。

 

③更新用のフィールドを作成

サブテーブルとは別にフィールドを作り、サブテーブルの変更と一緒にそのフィールドも変更されるようにした上で、そのフィールドが変更された時は実行しない、といったようにすることができます。

 

別件で補足ですが、今回実装される処理には全く影響しないものの、function(event)の実行文が終わる際にはreturn event;をすることを推奨します。今後カスタマイズする際、別のプログラムが動作しなくなる可能性があります。

      });
      }); //event end

        });
return event;
      }); //event end

mls-hashimoto 様

丁寧なお返事ありがとうございます。

いくつかの参考を提示してくださり大変助かります。
誠にありがとうございます。

提示してくださった3つの方法をもとにいろいろ試してみたいと思います。
また、return event;の件についてもご教示ありがとうございました。
使い方が分かっておらず書いたり書かなかったりしていたので今後は実行文が終了するたびにreturn event;するように心がけます。

取り急ぎお礼申し上げます
本当にありがとうございました。