kintone

任務だ、勤怠管理を作れ。PART.3

Y氏
Y氏
次は日付ごとに入力jできるようにすることだな。

さあ、任務を続けるぞ。
な~にプロセス管理ができたぐらいで仕事したつもりになってんだ、ってことですね。

日付ごとに入力できるようにするって…サブテーブル置いておけばいいじゃんね。
こんな感じでほら…。

Y氏
Y氏
30クリックも行追加ボタンを押させるつもりか?
うちをブラック企業にするつもりか!

で、ですよね~。
作りたい月の日付が自動でばぁ~~っと出たららくちんですよね。
はい、作ります。
仕様を確認しよう。

①レコードを新規作成するタイミングで
②作成者が作りたい月を入力し
③その月の日付をすべてサブテーブルにセットする

な~んだ。3ステップ。簡単じゃないか。
地獄の始まりだった。

①レコードを新規作成するタイミングで

これはもう簡単だね。今回はapp.record.create.showを使うぞ。
レコードの新規作成画面が表示されたときに着火できるイベントだ。

②作成者が作りたい月を入力し

これは本当はなくてもいい機能。
というのも、年月をマスタで作ってあるからルックアップしてもらえばいい。
ただ、なんか…かっこいいじゃん?
どうやら入力画面っていうのはプロンプトっていうらしい。それを表示させる魔法が
window.prompt(“作成する年月をyyyymmの形式で入力してください。”)だ。

この時まだ僕は知らなかった。
yyyymm形式で入力させたことであんなに苦労するなんて…。

③その月の日付をすべてサブテーブルにセットする

あ~はいはい。その月の日付をすべてセットすればいいのね。
うんうん。その月の日付を~
その月の・・・日付を・・・。

その月の日付ってどうやって取り出すねん

そうなんです。yyyymm(例:201906)ってただの数字として入力しているだけで、
プログラム的にはあ、2019年の6月じゃん!とはならないわけです。
まずは数字のデータを日付に変換する必要があるってこと。
日付のデータはnew Dateとかいうのを使うわけだが、俺は気づいてしまった。

その月の最終日を取り出せばいいんじゃないか?

new Dateの使い方…とかってサイトを見ていると、
new Date(2016, 2, 0); って書けば最終日が取得できるぜ!!って書いてある。
なるほど?最初の日は1日に決まってるんだから、
最終日を取得してしまえば、その間はループさせればいいんじゃね~?って。

まずは 入力させた値を年と月を分けよう。
yearmonthって箱に入力させた値が入っている。
それをyear(年)・month(月)という箱に分けて入れたい。

var year = yearmonth.slice(0,4); //2019を取り出す
var month = yearmonth.slice(4.6); //06を取り出す

そして最終日を取得する…!
var lastMonthDay = new Date(year, month, 0).getDate();

怒涛のループで全日付をたたき出す!!

javascriptのループ文はいくつかあるらしいけど、forを使ってみる。

for(i =1; i <=lastMonthDay; i = i +1){
//iという数字が月の最終日の数字になるまで繰り返す
(これで1日から28日まで繰り返すことになる)
var dates = year + “-” + month + “-” + i;
//datesって箱に日付をいれていく!
 kintoneは2019-6-1っていう表記方法だからそれに合わせてハイフンをいれてる。
 これ、本当は要らないのかも?

そしてサブテーブルにセット!!
これだ…!!

完成形

作成年月を入力させ、ルックアップする

kintone.events.on(‘ app.record.create.show , function(event) {
var record = event.record;
var yearmonth = window.prompt(“作成する年月をyyyymmの形式で入力してください。”);
record[‘年月’][‘value’] = yearmonth; // ルックアップフィールドの値
record[‘年月’][‘lookup’] = true;
return event;
});

ループで全日付をセットする

kintone.events.on(‘app.record.create.change.年月’,function(event){
var record = event.record;
var yearmonth = record[‘年月’].value;
var year = yearmonth.slice(0,4);
var month = yearmonth.slice(4.6);
var lastMonthDay = new Date(year, month, 0).getDate();
record.Table.value.pop();
for(var i =1; i <=lastMonthDay; i = i +1){
var dates = year + “-” + month + “-” + i;
var row = {
“value”: {
“日付”: {
“type”: ‘DATE’,
“value”: dates
},
“勤務形態”: {
“type”: ‘DROP_DOWN’,
“value”: “A”
},
“始業”: {
“type”: ‘TIME’,
“value”: ’13:00′
},
“終業”: {
“type”: ‘TIME’,
“value”: ’22:00′
},
“休憩”: {
“type”: ‘NUMBER’,
“value”: ’60’
},
“勤務時間”: {
“type”: ‘CALC’,
“value”: ‘8:00’
}
}
};
record.Table.value.push(row);
}
}
return event;
});