4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

kintoneAdvent Calendar 2021

Day 18

kintone開発者向けにツールを作ろうと思った話

Last updated at Posted at 2021-12-17

はじめに

まずはこの記事を見てくれたみなさんに、謝っておくことがあります。

正直、記事を書くための準備をする時間がなかったっす!申し訳ない!!

やろうと思っていたこと

結構気合をいれて、アプリストアに用意されているアプリを限界(?)までカスタマイズしたら
どんなものが作れるか?
何年か前までやっていた、気象関係のシステムのノウハウをkintoneに取り込んだらどうなるか?
という、比較的気合の入った内容を考えていたのですが、諸々の業務が落ち着かず、標題の通り
kintone開発者向けのツールを作る話になりました。(規模縮小)

そしてこの、kintone開発者向けのツールについても未完成でございます。
大変情けない・・。

やろうと思っていたことは、Google Chrome の拡張機能で、kintone開発者に役立つツールを
何か作成しようと思っていました。
既にいくつかkintone向けの拡張機能はありますが、kintone開発者向けに何か
リリースしてみようかと、そんな構想でおりました。

現状とこれからについて

最近、ブックマークレットを使って、kintone JavaScript APIを実行して、普段の作業を
少しだけ効率化させることをしていました。
これをChromeの拡張機能に落とし込んでみようか。と考えています。

ブックマークレット

ブックマークレットは、ブラウザのお気に入り機能のURLに、JavaScriptのコードを入れ込み
JavaScriptを実行させる機能です。

ウィキペディア ブックマークレット
https://ja.wikipedia.org/wiki/%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF%E3%83%AC%E3%83%83%E3%83%88

image.png
こんな感じで、ブラウザのお気に入りに登録した内容のURLに、JavaScriptを入れておくことで
そのお気に入りをクリックしたときに、設定しておいたJavaScriptが動作します。

ここで、kintone REST APIやkintone JavaScript APIを使おうぜ!ということです。

サンプル

ブックマークレットは、URL入力欄に javascript:(自分で書いたコードを1行にしたもの)
の形式で設定します。

サンプルをいくつか作成してみましたので使ってみてください。

現在開いているレコードのJSONをクリップボードにコピー

javascript:(async()=>{const e=kintone.app.record.get(),t=e=>{const t=document.createElement("pre");t.style.webkitUserSelect="auto",t.style.userSelect="auto",t.textContent=e,document.body.appendChild(t),document.getSelection().selectAllChildren(t);const n=document.execCommand("copy");return document.body.removeChild(t),n};t(JSON.stringify(e))})();

実行結果

{
  "record": {
    "レコード番号": { "type": "RECORD_NUMBER", "value": "2" },
    "Last_user": {
      "type": "MODIFIER",
      "value": { "code": "numata", "name": "numata" }
    },
    "Applicant": {
      "type": "CREATOR",
      "value": { "code": "numata", "name": "numata" }
    },
    "Updated_datetime": {
      "type": "UPDATED_TIME",
      "value": "2021-12-17T13:18:00Z"
    },
    "Application_date": {
      "type": "CREATED_TIME",
      "value": "2021-12-17T13:18:00Z"
    },
    "title": { "type": "SINGLE_LINE_TEXT", "value": "アドベントカレンダー" },
    "member": {
      "type": "USER_SELECT",
      "value": [{ "code": "numata", "name": "numata" }]
    },
    "st": { "type": "DATE", "value": "2021-12-17" },
    "ed": { "type": "DATE", "value": "2021-12-17" },
    "progress": { "type": "NUMBER", "value": "0" },
    "desc": { "type": "MULTI_LINE_TEXT", "value": "" },
    "hidden": { "type": "CHECK_BOX", "value": [] },
    "favorite": { "type": "CHECK_BOX", "value": [] },
    "file": { "type": "FILE", "value": [] },
    "Department_selection": { "type": "ORGANIZATION_SELECT", "value": [] },
    "list": { "type": "DROP_DOWN", "value": "未着手" },
    "tag": { "type": "CHECK_BOX", "value": [] },
    "文字列__1行_": { "type": "SINGLE_LINE_TEXT", "value": "" },
    "$revision": { "type": "__REVISION__", "value": "1" },
    "$id": { "type": "__ID__", "value": "2" }
  }
}

※注 コピーした時点では改行されていません。

フィールドコードとフィールド名をCSV形式でクリップボードにコピー

javascript:(async()=>{const e=await kintone.api(kintone.api.url("/k/v1/app/form/fields.json",!0),"GET",{app:kintone.app.getId()});let t="フィールドコード, フィールド名\r\n";Object.keys(e.properties).forEach(o=>{t+=`${e.properties[o].code}, ${e.properties[o].label}\r\n`});const o=e=>{const t=document.createElement("pre");t.style.webkitUserSelect="auto",t.style.userSelect="auto",t.textContent=e,document.body.appendChild(t),document.getSelection().selectAllChildren(t);const o=document.execCommand("copy");return document.body.removeChild(t),o};o(t)})();

実行結果

フィールドコード, フィールド名
st, 開始日
レコード番号, レコード番号
作業者, 作業者
hidden, 非表示フラグ
Last_user, 更新者
文字列__1行_, 文字列 (1行)
ステータス, ステータス
グループ, グループ
Department_selection, 担当組織
title, タスク名
list, リスト
カテゴリー, カテゴリー
Updated_datetime, 更新日時
file, 添付ファイル
Application_date, 作成日時
member, メンバー
progress, 進捗率
tag, タグ
Applicant, 作成者
favorite, お気に入り
ed, 終了日
desc, 説明

アプリの更新をして画面をリロード

javascript:(async()=>{await kintone.api(kintone.api.url("/k/v1/preview/app/deploy.json",!0),"POST",{apps:[{app:kintone.app.getId()}]}),location.reload()})();

実行結果

アプリの設定画面で、このボタンを押したことになります。

image.png

さいごに

私が所属している会社では、勤務実績をkintoneアプリに登録しています。
日課として、朝出社をしてから、勤務実績のアプリに今日の予定を入力するのですが
先ほどのブックマークレットの知識を生かして、直近の予定を取得して予定を入力してくれる
ブックマークレットを作成し、チョットダケ入力時間の削減をしています。

みなさんも、日々のkintone作業で活用できる場面があれば活用してみてください。

また、当記事は、主にブックマークレットのことを書きましたが、最終的な着地点としては
Google Chromeの拡張機能を作成することになります。
ブックマークレットはあくまはこの拡張機能作成の元ネタと考えています。

拡張機能の進み具合は、弊社、株式会社アーセスのブログにも記事を投稿しようかなと考えています。
進展があれば、また何か記事を投稿しようと思います。

最後まで読んでくださいまして、ありがとうございました。

4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?