kintone REST API Client でレコード複数件を操作する方法

今回は[前回](https://qiita.com/juri_don/items/138fa7c626da7d1590b4)の続きで、レコード複数件を処理してみる回です。

https://qiita.com/juri_don/items/138fa7c626da7d1590b4

レコード複数件について

* 取得（getRecords）
* 追加（addRecords）
* 更新（updateRecords）
* 追加または更新（upsertRecordをループ）
* 削除（deleteRecords）

の5種類の操作をします。
※100件までの縛りがあります。100件以上の処理がしたい場合はAllRecordsを使いましょう。

# アプリの準備
前回のアプリにスペースを追加します。（ラベルはお好みでどうぞ）

| フィールド種類 | フィールドコード | 備考 |
|:-:|:-:|:-:|
|スペース   | sp_m  |  テキストボックスやボタン設置する用のスペース |

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536148/a39cb85e-ca9b-0a41-6810-a7b96deb0bb1.png)

## 完成図
こんなイメージ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536148/e16bf921-6971-53ac-f852-433ef21e353b.png)


# JavaScript

前回のコードに追記していきます。
try-catchや処理成功or失敗後のメッセージ表示などは適宜追加してくださいね。

## テキストボックスの設置

カンマ区切りでレコード番号を指定するようにします。

```js
const sp_m = kintone.app.record.getSpaceElement("sp_m");
const text_m = new Kuc.Text({
  placeholder: "指定レコードID（,区切り）",
});
sp_m.appendChild(text_m);
```

## getRecords（複数レコード取得）


```js

// ボタン設置
const btn_getRecords = new Kuc.Button({
  text: "getRecords",
  type: "submit",
});
sp_m.appendChild(btn_getRecords);

// ボタンクリック
btn_getRecords.addEventListener("click", async (event) => {
  const client = new KintoneRestAPIClient();
  // resに複数レコード分取得
  const res = await client.record.getRecords({
    app: appId, 
    query: `$id in(${text_m.value}) order by $id asc`,
  });
  const obj = kintone.app.record.get();
  const tblRecords = [];
  // サブテーブルに展開
  res.records.forEach((r) => {
    tblRecords.push({
      id: null,
      value: {
        住所: {
          type: "SINGLE_LINE_TEXT",
          value: r.住所.value,
        },
        氏名: {
          type: "SINGLE_LINE_TEXT",
          value: r.氏名.value,
        },
        社員コード: {
          type: "SINGLE_LINE_TEXT",
          value: r.社員コード.value,
        },
      },
    });
  });
  obj.record.テーブル.value = tblRecords;
  kintone.app.record.set(obj);
});
```

## addRecords（複数レコード追加）

```js
const btn_addRecords = new Kuc.Button({
  text: "addRecords",
  type: "submit",
});
sp_m.appendChild(btn_addRecords);

btn_addRecords.addEventListener("click", async (event) => {
  const client = new KintoneRestAPIClient();
  const obj = kintone.app.record.get();

  // 登録する複数レコードを準備
  const recs = [];
  obj.record.テーブル.value.forEach((r) => {
    recs.push({
      社員コード: {
        value: r.value.社員コード.value,
      },
      氏名: { value: r.value.氏名.value },
      住所: { value: r.value.住所.value },
    });
  });

  const res = await client.record.addRecords({ app: appId, records: recs });
});
```

## updateRecords（複数レコード更新）
レコード番号をサブテーブルに展開するの忘れたので、重複禁止のフィールドで複数レコードを更新。

```js
const btn_updateRecords = new Kuc.Button({
  text: "updateRecords",
  type: "submit",
});
sp_m.appendChild(btn_updateRecords);

btn_updateRecords.addEventListener("click", async (event) => {
  const client = new KintoneRestAPIClient();
  const obj = kintone.app.record.get();

  // 更新するレコードを準備
  const recs = [];
  obj.record.テーブル.value.forEach((r) => {
    recs.push({
      updateKey: { field: "社員コード", value: r.value.社員コード.value },
      record: {
        氏名: { value: r.value.氏名.value },
        住所: { value: r.value.住所.value },
      },
    });
  });

  const res = await client.record.updateRecords({
    app: appId,
    records: recs,
  });
});
```

## upsertRecord（更新または追加）
upsertRecordsという複数レコード用のメソッドがないので、ループ回して1レコードずつUPSERTします。

```js
const btn_upsertRecords = new Kuc.Button({
  text: "upsertRecord",
  type: "submit",
});
sp_m.appendChild(btn_upsertRecords);

// 1件ずつなのでテーブル行数分繰り返す
btn_upsertRecords.addEventListener("click", (event) => {
  const client = new KintoneRestAPIClient();
  const obj = kintone.app.record.get();
  // こっちにasync
  obj.record.テーブル.value.forEach(async (r) => {
    const res = await client.record.upsertRecord({
      app: appId,
      updateKey: {
        field: "社員コード",
        value: r.value.社員コード.value,
      },
      record: {
        氏名: { value: r.value.氏名.value },
        住所: { value: r.value.住所.value },
      },
    });
  });
});
```

## deleteRecords（複数レコード削除）
テキストボックス内にカンマ区切りで入力したidのレコードを削除します。

```js
const btn_deleteRecords_m = new Kuc.Button({
  text: "deleteRecords",
  type: "submit",
});
sp_m.appendChild(btn_deleteRecords_m);

btn_deleteRecords_m.addEventListener("click", async (event) => {
  const client = new KintoneRestAPIClient();
  const res = await client.record.deleteRecords({
    app: "369",
    ids: text_m.value.split(","), // ←["1", "2", "3"] のような感じになってる
  });

  // お好みでサブテーブルクリアする
  // const obj = kintone.app.record.get();
  // obj.record.テーブル.value = [];
  // kintone.app.record.set(obj);
});
```

次回以降は他のメソッドも試してみたいと思います。