Copy Process Management Settings to Another App

Contents

Overview

This article introduces how to copy the process management settings of a Kintone App to another App, with a click of a button.

Sample Image

A button to copy the Process Management settings is placed in the record list view of the Expense Report App. When the button is clicked, an alert dialog will be displayed, and the Process Management settings will be copied to the destination App.

Animated GIF: User clicks on a button on the Record List page which starts the process for copying the process management settings.

The below screenshot shows the Process Management settings before the settings have been copied over.

Screenshot: The Process Management settings of the destination App before copying.

The below screenshot shows the Process Management settings after the settings have been copied over.

Screenshot:The Process Management settings of the destination App after copying.

Prepare the Apps

Two Apps are used in this article. One App holds the process management settings that will be copied. The other App is the destination App to copy the settings to. This article will use the following Apps:

  • Expense Report App: The settings will be copied from this App. The App is created from the Kintone Marketplace (External link).
  • New App: The settings will be copied to this App. This App will be made from scratch (External link).

Create the Expense Report App

Search and add the Expense Report App from the Kintone Marketplace (External link). The following workflow is set automatically in the process management settings (External link) of the Expense Report App when it is created.

Image of the workflow

Flowchart: The flow of the workflow process in the Expense Report App.

Open the Process Management settings page in the Expense Report App and delete the “Approver” and “Employee” user fields from the Assignee List option. This is necessary because these fields cannot be copied over to the destination App.

Screenshot: The process flow settings of the Expense Report App, highlighting what settings to delete.

Create a New App

Create an App (External link) that includes any types of fields. Save the form when finished and navigate to the Process Management settings. Check the first check box to enable the process management settings. This will create the default workflow shown below:

Flowchart: Image of the default workflow created in the App.

Sample Code

Prepare the following JavaScript code in a text editor. Replace the value of COPY_APPID with the App ID of the destination App. Navigate to the Expense Report App and upload the file into the Upload JavaScript for PC option of the JavaScript and CSS Customization settings (External link).

 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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
/*
 * Copyright (c) 2017 Cybozu
 * Licensed under the MIT License
 */
(function() {
  'use strict';

  // Target app ID
  var COPY_APPID = 200;

  function getProcessManagement() {
    var body = {
      'app': kintone.app.getId()
    };
    return kintone.api(kintone.api.url('/k/v1/app/status', true), 'GET', body).then(function(resp) {
      return resp;
    }, function(error) {
      return kintone.Promise.reject(error.message);
    });
  }

  function putProcessManagement(original) {
    var body = {
      'app': COPY_APPID,
      'enable': original.enable,
      'actions': original.actions,
      'states': original.states
    };

    return kintone.api(kintone.api.url('/k/v1/preview/app/status', true), 'PUT', body).then(function(resp) {
      return;
    }, function(error) {
      return kintone.Promise.reject(error.message);
    });
  }

  function deployProcessManagement() {
    var body = {
      'apps': [
        {
          'app': COPY_APPID
        }
      ]
    };
    return kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', body).then(function(resp) {
      alert('Copied process management settings to app ' + COPY_APPID + '.');
    }, function(error) {
      return kintone.Promise.reject(error.message);
    });
  }

  kintone.events.on(['app.record.index.show'], function(event) {
    if (document.getElementById('CopyProcessManagement') !== null) {
      return;
    }
    var menuButton = document.createElement('button');
    menuButton.id = 'CopyProcessManagement';
    menuButton.innerHTML = 'Copy Process Management';
    menuButton.onclick = function() {
      if (window.confirm('Do you want to copy process management settings to app ' + COPY_APPID + '?')) {
        getProcessManagement()
          .then(putProcessManagement)
          .then(deployProcessManagement)
          .catch(function(error) {
            alert(error);
          });
      }
    };
    kintone.app.getHeaderMenuSpaceElement().appendChild(menuButton);
    return;
  });
})();

Save the settings and Update the App. Navigate to the Record List page. A button should be displayed above the list of records. Click on the button to start the process for copying over the process management settings. After the process completes, navigate to the destination App, and check the process management settings. The process management settings should be updated with the new settings.

Code Explanation

The code uses the following 4 steps to copy the Process Management settings of the Expense Report App and deploy them to the Process Management settings of the New App:

  1. Place a button in the list view of the Expense Report App to trigger the code
  2. Retrieve the Process Management settings from the Expense Report App
  3. Update the settings of the destination App (the New App) with the settings retrieved in step 2
  4. Apply the pre-live App settings of the destination App (the New App) to the live environment

1. Place a button in the list view of the Expense Report App to trigger the code

A button is placed in the Record List page, above the list of records. Clicking the button runs the processes 2, 3 and 4 using promises.

 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
(function() {
  'use strict';

  // Target app ID
  var COPY_APPID = 200;

  kintone.events.on(['app.record.index.show'], function(event) {
    if (document.getElementById('CopyProcessManagement') !== null) {
      return;
    }
    var menuButton = document.createElement('button');
    menuButton.id = 'CopyProcessManagement';
    menuButton.innerHTML = 'Copy Process Management';
    menuButton.onclick = function() {
      if (window.confirm('Do you want to copy process management settings to app ' + COPY_APPID + '?')) {
        getProcessManagement()
          .then(putProcessManagement)
          .then(deployProcessManagement)
          .catch(function(error) {
            alert(error);
          });
      }
    };
    kintone.app.getHeaderMenuSpaceElement().appendChild(menuButton);
    return;
  });
})();

2. Retrieve the Process Management settings from the Expense Report App

Refer to the Get Process Management Settings API documentation for details on how to retrieve the Process Management settings from an App.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
function getProcessManagement() {
  var body = {
    'app': kintone.app.getId()
  };
  return kintone.api(kintone.api.url('/k/v1/app/status', true), 'GET', body).then(function(resp) {
    return resp;
  }, function(error) {
    return kintone.Promise.reject(error.message);
  });
}

3. Update the settings of the destination App (the New App) with the settings retrieved in step 2

Refer to the Update Process Management Settings API documentation for details on how to update the destination App, New App, with the settings retrieved in step 2.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
function putProcessManagement(original) {
  var body = {
    'app': COPY_APPID,
    'enable': original.enable,
    'actions': original.actions,
    'states': original.states
  };

  return kintone.api(kintone.api.url('/k/v1/preview/app/status', true), 'PUT', body).then(function(resp) {
    return;
  }, function(error) {
    return kintone.Promise.reject(error.message);
  });
}

4. Apply the pre-live App settings of the destination App (the New App) to the live environment

Step 3 updates the App settings, but these are not applied to the live environment until the Deploy App Settings API is used. Refer to the Deploy App Settings API Documentation for details on how to reflect the contents updated in step 3 onto an operational environment.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
function deployProcessManagement(copy) {
  var body = {
    'apps': [
      {
        'app': COPY_APPID
      }
    ]
  };
  return kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', body).then(function(resp) {
    alert('Copied process management settings to app ' + COPY_APPID + '.');
  }, function(error) {
    return kintone.Promise.reject(error.message);
  });
}

Reference