Cybozu developer networkのTipsのURL:

https://developer.cybozu.io/hc/ja/articles/202181714



入力されたデータを使って計算をするとき、その計算結果のみが必要で、計算のもとになったデータは必要ない場合があります。


そういう場合は、計算のもとになるデータをフィールドに一時的に置いておき、要らなくなったら削除、を繰り返すことで、そのフィールドを何度も再利用して計算させることができます。


例えば、タイムカードアプリでは出退勤時刻に加えて総休憩時間を管理する必要がありますが、毎回の休憩開始/終了の時間までは管理しない場合を考えてみましょう。

ある日のタイムカードが以下の様になっていたとします。


時刻

行動

備考

9:00

出勤


12:00

休憩開始


12:40

休憩終了

休憩時間40分

15:30

休憩開始


15:50

休憩終了

休憩時間20分

18:00

退勤



この時、「休憩時間40分」を求めるために休憩開始時刻と休憩終了時刻を記録する必要がありますが、「休憩時間40分」がわかった瞬間に休憩開始時刻と休憩終了時刻は要らなくなります。休憩時間40分を総休憩時間に足した後は、一回の休憩時間も要らなくなります。


休憩開始時刻、休憩終了時刻、休憩時間のデータを消せば、また次の休憩時に新しい休憩開始時刻、休憩終了時刻を入力することで休憩時間を計算できます。


このように、一時的なデータ置き場として利用するフィールドを置いておけば、入力、計算、削除のサイクルを繰り返すことができます。


では、具体的なカスタマイズ方法を見ていきましょう。


Customineの基本的な事柄は、こちらの「はじめてのカスタマイズ」をご参照ください。


アプリのフォーム

以下のフィールドを作成します。カスタマイズに関係のないフィールドはなくても構いません。


フィールドタイプ

フィールド名

フィールドコード

備考

文字列一行

社員番号

社員番号

カスタマイズ関係無し

文字列一行

氏名

氏名

カスタマイズ関係無し

文字列一行

アカウント名

アカウント名

カスタマイズ関係無し

日付

日付

日付

初期値:登録日

カスタマイズ関係無し

時刻

出勤時刻

出勤時刻

初期値:定時

カスタマイズ関係無し

時刻

退勤時刻

退勤時刻

初期値:定時

カスタマイズ関係無し

チェックボックス

状態

状態

項目:休憩中

フィールド名非表示

スペース


kyukeiButton

ボタンを設置する場所

計算

拘束時間

拘束時間

計算式:

(退勤時刻-出勤時刻)/60

表示形式:数値(桁区切りなし)

カスタマイズ関係無し

数値

総休憩時間

総休憩時間

初期値:0

初期値の設定を忘れるとカスタマイズがうまく動作しません!

計算

実働時間

実働時間

計算式:

拘束時間-総休憩時間

表示形式:数値(桁区切りなし)

カスタマイズ関係無し

時刻

休憩開始時刻

休憩開始時刻


時刻

休憩終了時刻

休憩終了時刻


計算


休憩時間休憩時間計算式:
(休憩終了時刻-休憩開始時刻)/60

表示形式:数値(桁区切りなし)



やりたいこと

「休憩中」ではないとき

レコード詳細画面に「休憩開始」ボタンを表示する。クリックすると「休憩開始時刻」に現在時刻が入力され、「状態」の「休憩中」にチェックを入れる。


「休憩中」のとき

レコード詳細画面に「休憩終了」ボタンを表示する。クリックすると「休憩終了時刻」に現在時刻が入力される。その後、「休憩時間」の値を「総休憩時間」に加算し、「状態」の「休憩中」のチェックを外す。


Customineの設定

今回のカスタマイズは以下の様になります。



使っている「やること」


使っている「条件」


動作の仕組み

ボタンの設置(アクション番号30,31)


ボタンをスペースに配置する」を使ってスペースにボタンを設置しています。

フィールド値が特定の値ならば」で場合分けし、稼働時は「休憩開始」ボタンを、休憩時は「休憩終了」ボタンを表示します。


「休憩開始」ボタンを押した時(アクション番号32,33,34,35)

32の「日付や時刻をフォーマットする」で現在日時(=now())を時刻だけのデータに変換し、33の「フィールドに値をセットする」で変換した時刻を「休憩開始時刻」に入力し、34の「フィールドに値をセットする」で「休憩中」にチェックを入れています。


ここまででレコード自体は更新されていますが、画面上には何の変化もありません。

そこで、35で「レコードが自動的に保存された時」「画面をリロードする」ことで、画面を自動的に更新しています。


詳細画面でのレコード自動更新と画面の再読み込みについてはこちらのTipsをご覧ください。


押下前

押下後


「休憩終了」ボタンを押した時(アクション番号35,36,37,38,39,40)

36,37で現在時刻を「休憩終了時刻」に入力し、38の「フィールド値をクリアする」で「休憩中」のチェックを外し、35で画面を再読み込みする流れまでは先程の「休憩開始」ボタンとほぼ同じです。


これで「休憩開始時刻」と「休憩終了時刻」が入力されたので、「休憩時間」が自動計算されたはずです。なので38の後、35で再読み込みされる前に、「総休憩時間」に算出された「休憩時間」を加算したいところです。


ですが、「他のアクションの実行が完了した時」で38の直後に実行しようとすると「休憩時間」の計算が終わる前に実行されてしまいます。

そんなときのために「計算フィールドの値が変わった時」があるのですが、残念ながら詳細画面には対応していません。


そこで、別の方法を提案します!


36,37,38が終わると35で画面が再読み込みされます。その時には「休憩時間」が算出されているので、その瞬間を狙います!


再読み込みされた直後も「詳細画面を表示した時」に該当するので、「フィールド値が特定の値ならば」で「休憩開始時刻」「休憩終了時刻」が入力されているときに限定することで、「休憩終了」ボタンが押されて「休憩時間」が算出されて、画面が再読み込みされたときに初めて発生するアクションを作り出すことができます。


39の「フィールドに値をセットする」で「総休憩時間」に今回の「休憩時間」を加算しています。

40の「フィールド値をクリアする」は「休憩開始時刻」、「休憩終了時刻」をクリアすることで、その後詳細画面を表示しなおした時に39が暴発するのを防いでいます。


39,40でレコードが更新されるので、その後35がもう一度画面を再読み込みします。


押下前

自動画面再読み込み一回目

一瞬だけこの画面が表示されてすぐに二回目の画面再読み込みが始まります。

自動画面再読み込み二回目


※本当にこんなに休憩しているわけではないですよ?


休憩開始時刻・休憩終了時刻を入力不可に(アクション番号41)

「休憩開始時刻」・「休憩終了時刻」がボタンを押す以外の方法で入力できてしまうと、正しく動作しない可能性が出てきます。そこで「休憩開始時刻」・「休憩終了時刻」は入力できないようにしておくのが良いでしょう。見せる必要もないので、「休憩時間」も合わせて「フィールドやグループを非表示にする」で隠しておくといいでしょう。



+αカスタマイズ

今回のカスタマイズ例には含めていませんが、「休憩開始」「休憩終了」ボタンを間違えて押してしまうと面倒なので、ボタンを押してから処理を始める前に「確認ダイアログを表示する」を挟んであげると親切ですよ!


終わりに

詳細画面で各フィールドを操作するようにkintoneアプリをカスタマイズするのは追加画面、編集画面と比べて少し難しいですが、「やること」と「条件」の組み合わせ次第で思わぬところに解決法があったりします!


また、Customineの機能はどんどん更新されるので、昨日出来なかったことも今日はできるかもしれません!

Customineヘルプサポートで最新の情報をチェックしてみてください。


もし分からないことがありましたら、フォーラムの方でご質問ください。