プロセス管理の承認フローを連動させる!アプリ間でプロセス管理を連携させてみよう

目次

はじめに

kintoneのプロセス管理を利用していて、次のように思ったことはありませんか?

「〇〇アプリの申請が済んでいるか確認してからxxアプリで承認したいな〜」

(例)営業部内の出張申請で承認を得ているのを確認してから、経理部側で出張旅費の承認をしたい。

このような場合、承認者がわざわざ別アプリの申請レコードを探すか、申請者が都度別アプリのレコードのURLを伝えることになったりと、やりとりが面倒ですよね。
本記事では関連する別アプリのプロセスが完了したら、自動でそれがわかるようなカスタマイズを紹介したいと思います!

申請フローのイメージ

今回は、アプリAとアプリBの2つアプリを使い、シンプルなカスタマイズ例を紹介します。
アプリAを親プロセスアプリ、アプリBは子プロセスアプリという立ち位置で利用します。
カスタマイズで実現するプロセス管理は次のようなフローになります。

  1. 申請者がアプリAにレコードを作成し、プロセスを進める。
  2. アプリAで入力した内容を使って、自動的にアプリBにもレコードを作成し、プロセスが進む。
    アプリAのレコードはアプリBのレコードが承認されるまでプロセスを進めることはできない。
  3. アプリBの承認者がレコードの内容を承認する。
  4. アプリAのレコード内にある「アプリBの承認完了フラグ」が自動で完了になり、プロセスが進む。
  5. アプリAの承認者がレコードの内容を承認する。

今回、新たにカスタマイズで実現する範囲は、2の「アプリAのレコードはアプリBのレコードが承認されるまでプロセスを進めることはできない」の部分と4の処理になります。

下準備

アプリの準備

カスタマイズで利用するアプリを準備しましょう!
今回はシンプルなフォームを使ってカスタマイズを実装してみます。

アプリAとアプリBに以下のフィールドを追加します。

アプリA
フィールド名 フィールドコード フィールドタイプ
申請タイトル 申請タイトルA 文字列(1行)
申請内容 申請内容A 文字列(複数行)
アプリBの承認完了フラグ アプリBの承認完了フラグ チェックボックス
アプリB
フィールド名 フィールドコード フィールドタイプ
申請タイトル 申請タイトルB 文字列(1行)
申請内容 申請内容B 文字列(複数行)
アプリAのレコードID アプリAのレコードID 文字列(1行)

プロセス管理の設定

アプリA、アプリBともに、「プロセス管理を有効にする」のチェックを入れます。
それぞれ以下のとおりにプロセス管理の設定を変更します。

アプリA:プロセス管理の設定
  1. 「ステータス」の設定
    1. ステータス「処理中」を「処理中(アプリB未承認)」に変更する。
    2. 「処理中(アプリB承認済み)」を追加する。
  2. 「プロセス」の設定
    1. 未処理の実行後のステータスを「処理中(アプリB未承認)」に設定する。
    2. 「未処理」の次の行にプロセスを1件追加し、アクション実行前のステータスを「処理中(アプリB未承認)」に設定する。
    3. ステータス「処理中(アプリB未承認)」でアクションが実行できる条件を「アプリBの承認完了フラグ:次のいずれかを含む:完了」に設定する。
    4. ステータス「処理中(アプリB未承認)」でのアクション名を「最終承認者へ申請する」に設定する。
    5. ステータス「処理中(アプリB未承認)」での実行後のステータスを「処理中(アプリB承認済み)」にする。
    6. ステータス「処理中(アプリB承認済み)」の作業者は「次のユーザーのうち1人」を選択し、任意のユーザーを設定する。

アプリB:プロセス管理の設定

「プロセス管理を有効にする」のチェックを入れます。
ステータス「処理中」の作業者は「次のユーザーのうち1人」を選択し、任意のユーザーを設定します。

JavaScriptカスタマイズ

ここまでの準備ができたらJavaScriptカスタマイズを加えていきます。
まず、アプリAに下のJavaScriptを適用します。20行目はアプリBのアプリIDに修正してください。

  • アプリBのアプリIDが2の場合
    • 修正前:const appId = 'xxx';
    • 修正後:const appId = '2';
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
/*
 * プロセスを進めると自動で別アプリのレコードを作成し、ステータスを進めるサンプルプログラム
 * Copyright (c) 2025 Cybozu
 *
 * Licensed under the MIT License
 * https://opensource.org/license/mit/
 */

(() => {
  'use strict';

  // アプリBの承認完了フラグを画面上で編集できないようにする
  kintone.events.on(['app.record.create.show', 'app.record.edit.show', 'app.record.index.edit.show'], event => {
    event.record['アプリBの承認完了フラグ'].disabled = true;
    return event;
  });

  kintone.events.on('app.record.detail.process.proceed', async (event) => {
    const action = event.action.value;
    if (action !== '処理開始') {
      return event;
    }
    const appId = 'xxx'; // アプリBのアプリIDに書き換えてください
    const record = event.record;
    const paramRecordPost = {
      app: appId,
      record: {
        申請タイトルB: {
          value: record['申請タイトルA'].value
        },
        申請内容B: {
          value: record['申請内容A'].value
        },
        アプリAのレコードID: {
          value: record.$id.value
        }
      }
    };

    try {
      const resp = await kintone.api(kintone.api.url('/k/v1/record.json', true), 'POST', paramRecordPost);
      const recordId = resp.id;
      const paramStatusPut = {
        action: action,
        app: appId,
        id: recordId
      };
      await kintone.api(kintone.api.url('/k/v1/record/status.json', true), 'PUT', paramStatusPut);
      alert('アプリBのレコードを作成し、プロセスを進めました。');
    } catch (err) {
      console.log(err);
    }
    return event;
  });
})();

次に、以下のJavaScriptをアプリBに適用します。14行目はアプリAのアプリIDに修正してください。

  • アプリAのアプリIDが1の場合
    • 修正前:const appId = 'xxx';
    • 修正後:const appId = '1';
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
/*
 * プロセスを進めると関連する別アプリのレコードを更新とステータスを進めるサンプルプログラム
 * Copyright (c) 2025 Cybozu
 *
 * Licensed under the MIT License
 * https://opensource.org/license/mit/
 */

(() => {
  'use strict';

  kintone.events.on('app.record.detail.process.proceed', async (event) => {
    const actionB = event.action.value;
    if (actionB !== '完了する') {
      return event;
    }
    const appId = 'xxx'; // アプリAのアプリIDに書き換えてください
    const recordId = event.record['アプリAのレコードID'].value;
    const paramsRecordPut = {
      app: appId,
      id: recordId,
      record: {
        アプリBの承認完了フラグ: {
          value: ['完了']
        }
      }
    };

    try {
      await kintone.api(kintone.api.url('/k/v1/record.json', true), 'PUT', paramsRecordPut);
      const actionA = '最終承認者へ申請する';
      const paramStatusPut = {
        action: actionA,
        app: appId,
        id: recordId
      };

      await kintone.api(kintone.api.url('/k/v1/record/status.json', true), 'PUT', paramStatusPut);
      alert('アプリAのレコードのプロセスを進めました。');
    } catch (err) {
      console.log(err);
    }
    return event;
  });
})();

動作確認

カスタマイズを反映させたら、動作確認をしていきます。
アプリAでレコードを作成し「処理開始」をクリックし「実行」を選択してプロセスを進めましょう。
アプリBのレコード作成とプロセスの進行が成功すると「アプリBのレコードを作成し、プロセスを進めました」とメッセージが表示されます。

ここまでは通常の複数アプリ連携と同じ挙動になっています。

なお、アプリAに作成した「アプリBの承認完了フラグ」は、カスタマイズによりレコードの追加・編集画面やレコード一覧画面のインライン編集からは変更できないようになっています。

次に、プロセスの作業者として割り当てられたユーザーでアプリBを開き、カスタマイズにより作成されたレコードを確認します。
プロセス管理のステータスが「処理中」になっていて、申請タイトルと申請内容にアプリAで記入した内容が記入されていることを確認し「完了する」のアクションを実行しましょう。

「アプリAのレコードのプロセスを進めました」とブラウザー上に表示されれば、カスタマイズが実行された証拠です!

アプリAのレコードを開くと、プロセスのステータスが「処理中(アプリB承認済み)」に進み、「アプリBの承認完了フラグ」が「完了」になっていることが確認できます。

最後に、承認の担当ユーザーが「完了する」のアクションを実行することで申請のプロセスは完了です!

おわりに

いかがでしたでしょうか?
プロセス管理でアクションを実行するときのイベント 」や「 1件のレコードのステータスを更新する 」を活用することで、このように他のアプリとプロセス管理を連携できます。

標準機能では実現できない申請フローがあった際には「カスタマイズで実現できないか?」と考えるヒントになれば幸いです!

注意事項

本カスタマイズはPCのみで動作します。

information

このTipsは、2025年7月版kintoneで動作を確認しています。