kintoneゼロ埋めプラグイン製作記（後編）

全９回にわたって書いた、プラグイン作家になる為記事「プラグイン開発メモその１〜その９」までのまとめ記事後編です。
[*前編はこちらから](https://qiita.com/sy250f/items/9f40f528a29fb2dd0090)


# 実データを使ってのJavaScriptカスタマイズ
実際に設定画面で保存した値を読み込んで利用します。

```customize.js
(function(pluginId) {
    "use strict";
    // プラグインの設定情報を取得
    let plugInConf = kintone.plugin.app.getConfig(pluginId)
    if (!plugInConf) { return false; }
    let config = {
        'ZeroFillItem': JSON.parse(plugInConf.ZeroFillItem)
    };

    // 詳細画面　編集
    kintone.events.on(['app.record.edit.show', 'app.record.create.show'], function(event) {
        let myIndexButton = document.createElement('button');
        myIndexButton.id = 'my_index_button';
        myIndexButton.innerHTML = 'ゼロ埋めボタン';
        myIndexButton.onclick = function() {
            let record = kintone.app.record.get();
            console.log(record);
            config.ZeroFillItem.forEach(function(value){
                // プラグインの設定値がオブジェクトの時
                if ( Object.prototype.toString.call( value ) === "[object Object]" ) {
                    // SUBTABLEの場合
                    let objVal = Object.values(value);
                    let objKey = Object.keys(value)[0];
                    for (let values of record.record[objKey].value) {
                        for (let v of objVal[0]) {
                            if (!values.value[v].value) {
                                console.log("record.value is NULL or undefined");
                                values.value[v].value = 0;
                            } else {
                                console.log(values.value[v].value);
                            }
                        }
                    }

                } else {
                    // SUBTABLE以外
                    if (!record.record[value].value) {
                        record.record[value].value = 0;
                    } else {
                        console.log(record.record[value].value);
                    }

                }
            });
            kintone.app.record.set(record);
        }
        kintone.app.record.getHeaderMenuSpaceElement().appendChild(myIndexButton);
        return event;
    });
})(kintone.$PLUGIN_ID);
```
# プラグイン動作画面
新規レコード作成。
<img width="769" alt="スクリーンショット 2019-02-21 7.24.05.png" src="https://qiita-image-store.s3.amazonaws.com/0/214523/e5dfc5d6-4d67-2364-df91-0ebc5a7ba14c.png">

ゼロ埋めボタンを押した後。設定画面でチェックしたフィールドをゼロで埋めています。
<img width="765" alt="スクリーンショット 2019-02-21 7.24.21.png" src="https://qiita-image-store.s3.amazonaws.com/0/214523/abd407fc-785e-a430-731d-9d8e6accb312.png">

レコード保存。計算結果の#N/A!のエラー表示が回避されます。
<img width="711" alt="スクリーンショット 2019-02-21 7.24.35.png" src="https://qiita-image-store.s3.amazonaws.com/0/214523/8d75d397-0193-5b22-98a0-1f0d7ba03cfa.png">

# まとめ
今回初めてkintoneプラグインを作った感想。

- 設定画面のコードを書くのが大変
- 設定値のデータ構造を先に決めておくことが肝心

特に、設定値のデータ構造は最初に決めておかないと後で変更するのは大変だなと感じました。

今回先にテストで作ったプラグインにサブテーブル対応の機能を追加した際に、設定値のデータ構造を変更してその変更のデバッグに丸２日かかってしまいました。
サブテーブルはいまいち慣れないですね。

今回作成したコードはGitHubに載せてあります。コメントもデバッグコードもそのままで、コードのリファクタリングも出来てませんが、ひとまず動くコードになっています。

 - https://github.com/sy250/zero-fill

# 今後の展望

これまでのカスタマイズコードをプラグインに切り出して行きたいと思っています。

# 参考リンク
今回のプラグイン作成に関しては、公開されているプラグインのサンプルコードを参考にしています。
また、プラグインの開発環境やツールについても色々参考にさせていただきました。ありがとうございます。
それと、昨年の kintone Café Japan でこれからどうやっていこうかと悩んでいた私の話を聞いてくれて、プラグインを作ってみたらとアドバイスをいただいたアクアビットの長井さんに感謝致します。
その言葉が無かったらプラグインを作ってみる試みも無かったかと思います。少し大げさかもしれませんが。

参考リンクを以下に上げます。

- [サンプルプラグイン](https://developer.cybozu.io/hc/ja/sections/200681620)
- [プラグイン開発](https://developer.cybozu.io/hc/ja/sections/200644024)

後で追記します。

- [kintoneゼロ埋めプラグイン製作記（前編）](https://qiita.com/sy250f/items/9f40f528a29fb2dd0090)