kintoneで別アプリの情報を取得してalertのポップアップに表示する


**kintoneアプリに任意のボタンを配置して、
別アプリの情報を取得してポップアップで表示する備忘です。**
#目的
この記事では別アプリのデータを取得としていますが、
実際の目的としては、同じアプリ内に一意で採番されている特定のフィールドの値について、
新規レコード作成時に、一意となる値を設定させるために、最近採番された値を取得したい。
当初は、一覧の先頭に一意に採番されている特定フィールドを表示（かつ降順で並び替え）させて対応していました。

#完成系
<img width="258" alt="アプリ画像1.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536171/a336b0e1-43a4-e4cd-fb11-7ee734f006c2.png">

「採番済発注番号(降順)」をクリックすると、

<img width="232" alt="アプリ画像2.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536171/27e06946-eece-43ac-573b-64ec75e18f9a.png">

alertでポップアップに別アプリの情報を取得した結果を表示させる。

#やったこと
###レイアウトについて

ボタンを追加した場所には、アプリ内でスペースを設定しています。
また、ボタンの装飾は、kintoneの「保存」ボタンと同じcssをjsで設定しています。

<img width="237" alt="アプリ画像4.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536171/b2097171-54ef-ffd6-45d0-21cdf4eb7ebe.png">

<img width="259" alt="アプリ画像5.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536171/c8db7aab-da0f-6553-ce9e-95a86b709e4c.png">

###JavaScriptについて

以下のように用意されているライブラリと自前で作成した「test.js」を配置しています。
ライブラリは、
「https://kintone.github.io/kintoneUtility/kintoneUtility.min.js」をURLで設定するか、
「[kintone Utility for JavaScriptのGitHub](https://github.com/kintone/kintoneUtility)」からライブラリをダウンロードして読み込ませる。
下記の例では後者で対応しています。


<img width="208" alt="アプリ画像3.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536171/d2919e92-73da-cc5d-d350-f375776becb7.png">

自前作成プログラムでは、
別アプリの「発注依頼書番号」と「案件名」を「発注依頼書番号」の降順にして、
14件取得しています。

```js
(function() {
   'use strict';
   
   // トリガーイベントの記載
   let events = ["app.record.edit.show","app.record.create.show"];
   
   kintone.events.on(events, function(e) {
        let button = document.createElement('button');
        let alertMessage = "";
        button.innerHTML = '採番済発注番号(降順)';
        button.className = "gaia-ui-actionmenu-save";
        
        // クエリの作成
        let param = {
            app: 227,
            query: 'order by 発注依頼書番号 desc limit 14',
            fields: ['発注依頼書番号','案件名'],
            totalCount: true,
            isGuest: false
        };
       
        // kintoneUtilityレコード(複数取得)：最大500件
        kintoneUtility.rest.getRecords(param).then((response) => {
            // JSON形式で取得する場合
            //console.log(JSON.stringify(response,null,' '));
            
            response.records.forEach((record) => {
                alertMessage += record.発注依頼書番号.value + ":" +  record.案件名
.value + "\n"; 
            });
            
        }).catch((error) => {
            console.log(error.mesage);
        });
        
        // 追加したボタンがクリックされたときのイベントを設定
        button.addEventListener('click',() => window.alert(alertMessage));
       
        // 追加したボタンを画面上に追加
        kintone.app.record.getSpaceElement('test').appendChild(button);

   });
})();
```

#参考にした物
kintoneUtility.restは以下の記事を参考にさせていただきました。
大変助かりました。ありがとうございました。

１.[「ねばまい」さんのブログ](http://nevermyroad.com/?p=324)
２.[kintone Utility for JavaScriptのGitHub](https://github.com/kintone/kintoneUtility)
３.[「しゅフリーすたいる」さんのブログ](https://syufree-style.club/room/2018/09/18/kintone-%E5%A4%A7%E9%87%8F%E3%81%AE%E3%83%AC%E3%82%B3%E3%83%BC%E3%83%89%E3%82%92%E5%85%A8%E4%BB%B6%E5%8F%96%E5%BE%97%E3%81%97%E3%81%A6%E5%86%85%E5%AE%B9%E3%82%92%E6%9B%B4%E6%96%B0%E3%81%97%E3%81%9F/)
４.[「@kiku38」さんの「kintone Utility for JavaScript を使ってみたよ」](https://qiita.com/kiku38/items/f903fcdf0c4e3d6ac1ab#getRecords)