業務システムを作る上で欠かせないのが日付処理。
Moment.jsという便利なライブラリがあるので、業務に使えそうな日付処理を中心にkintone（業務システムを使える、作れるということで相性いいのかなー）で表現してみました。kintoneで日付処理を行う場合には、Cybozu CDNにあるMoment.jsを使ってみましょう。
利用するLibrary
- Cybozu CDN のMoment.jsを利用
- Moment.jsのバージョン：2.15.2
kintoneの準備
今回は開発目的なのでcybozu developer network で無償の開発者ライセンスを取得。
開発したいけどkintoneの環境を持っていない！という方には便利です。
ログインしたら、kintoneアプリを作り、テーブルに表示してみましょう。
kintoneのアプリ構成
| フィールド名 | フィールドコード | フィールドタイプ |
|---|---|---|
| 基準日（日時A） | DatetimeA | 日時 |
| 比較対象日（日時B） | DatetimeB | 日時 |
| 説明 | Detail | 文字列（1行） |
| 結果 | Result | 文字列（1行） |
※説明、結果は「テーブル」形式
入力イメージ
登録後の画面
レコード作成時に入力した日時A、日時Bの値をもとにMoment.jsで処理した値が保存されるというものです。
プログラム
次のプログラムを、UTF-8でJSファイルとして保存して、kintoneにロードしましょう。
- JavaScriptファイルの読み込み手順
- Cybozu CDNにあるMoment.jsのリンクも忘れずに
読み込んだ後の画面です。
JavaScript
(function() {
"use strict";
// Set local and starting week
moment.locale('ja', { week: { dow: 0, doy: 4 }});
// Insert rowdata in need fieldtype ex.'SINGLE_LINE_TEXT'
function createRow(detail, result) {
return {
'value': {
'Detail': {
'type': 'SINGLE_LINE_TEXT',
'value': detail
},
'Result': {
'type': 'SINGLE_LINE_TEXT',
'value': result
}
}
};
}
var eventDatetime = function(event) {
var record = event.record;
var dateA = record['DatetimeA'].value;
var dateB = record['DatetimeB'].value;
var arrRow = [];
// Initialize table data
record['Table']['value'].length = 0;
// Basedatetime
arrRow.push(createRow("基準日（日時A）の処理", "-----"));
arrRow.push(createRow("日時Aの日付のみ(-)", moment(dateA).format('YYYY-MM-DD')));
arrRow.push(createRow("日時Aの日付のみ(/)", moment(dateA).format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの日付のみ(年月日)", moment(dateA).format('YYYY年M月D日')));
arrRow.push(createRow("日時Aの日付のみ(年月日+曜日)", moment(dateA).format('YYYY年M月D日 (ddd)')));
arrRow.push(createRow("日時Aの日時(kintone仕様1)", moment(dateA).format('YYYY-MM-DDTHH:mm:ss±HH:mm')));
arrRow.push(createRow("日時Aの日時(kintone仕様2)", moment(dateA).format('YYYY-MM-DDTHH:mm:ssZ')));
arrRow.push(createRow("日時Aの時間のみ（24時間表記）", moment(dateA).format('HH:mm')));
arrRow.push(createRow("日時Aの時間のみ（12時間表記）", moment(dateA).format('h:mm')));
arrRow.push(createRow("日時Aの時間のみ（AM/PM表記）", moment(dateA).lang("en").format('ah:mm')));
arrRow.push(createRow("日時Aの時間のみ（午前/午後表記）", moment(dateA).format('ah:mm')));
arrRow.push(createRow("日時Aの曜日（全て）", moment(dateA).format('dddd')));
arrRow.push(createRow("日時Aの曜日（略）", moment(dateA).format('ddd')));
arrRow.push(createRow("日時Aの年（全て）", moment(dateA).format('YYYY')));
arrRow.push(createRow("日時Aの年", moment(dateA).format('YY')));
arrRow.push(createRow("日時Aの月", moment(dateA).format('M')));
arrRow.push(createRow("日時Aの日", moment(dateA).format('D')));
arrRow.push(createRow("日時Aの5日前", moment(dateA).add(-5, 'day').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの10日後", moment(dateA).add(10, 'day').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの月の日数", moment(dateA).daysInMonth()));
arrRow.push(createRow("日時Aがうるう年かどうか", moment(dateA).isLeapYear()));
arrRow.push(createRow("日時Aの末日", moment(dateA).subtract(1, 'month').endOf('month').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの末日", moment(dateA).subtract(0, 'month').endOf('month').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの翌月１日", moment(dateA).subtract(-1, 'month').startOf('month').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの翌月末日", moment(dateA).subtract(-1, 'month').endOf('month').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの１週間の開始日", moment(dateA).startOf('week').format('YYYY/MM/DD (ddd)')));
arrRow.push(createRow("日時Aの１週間の終了日", moment(dateA).endOf('week').format('YYYY/MM/DD (ddd)')));
arrRow.push(createRow("日時Aの月曜日の日付", moment(dateA).day('Monday').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aの金曜日の日付", moment(dateA).day('Friday').format('YYYY/MM/DD')));
arrRow.push(createRow("日時Aは1年の何日目", moment(dateA).format('DDD')));
arrRow.push(createRow("日時Aは1年の何週目", moment(dateA).format('W')));
arrRow.push(createRow("日時Aの月の日数", moment(dateA).daysInMonth()));
arrRow.push(createRow("日時Aの年の日数", "関数なし"));
arrRow.push(createRow("日時Aのアメリカ表記1", moment(dateA).lang("en").format("M/D/YYYY")));
arrRow.push(createRow("日時Aのアメリカ表記2", moment(dateA).lang("en").format("MMMM D, YYYY")));
arrRow.push(createRow("日時Aのアメリカ表記3", moment(dateA).lang("en").format("MMM D, YYYY")));
arrRow.push(createRow("日時Aのアメリカ表記4", moment(dateA).lang("en").format("MM Do, YYYY")));
arrRow.push(createRow("日時Aのアメリカ表記5", moment(dateA).lang("en").format("MM/DD/YY")));
arrRow.push(createRow("日時Aの曜日（英語）", moment(dateA).lang("en").format('dddd')));
arrRow.push(createRow("日時Aの曜日（英語略）", moment(dateA).lang("en").format('ddd')));
arrRow.push(createRow("日時Aの曜日（フランス語）", moment(dateA).lang("fr").format('dddd')));
arrRow.push(createRow("日時Aの曜日（フランス語略）", moment(dateA).lang("fr").format('ddd')));
arrRow.push(createRow("日時Aの曜日（中国語）", moment(dateA).lang("zh-cn").format('dddd')));
arrRow.push(createRow("日時Aの曜日（中国語略）", moment(dateA).lang("zh-cn").format('ddd')));
// Compare datetime
arrRow.push(createRow("基準日との比較", "-----"));
arrRow.push(createRow("基準日との比較（日数）", moment(dateB).diff(moment(dateA), 'days')));
arrRow.push(createRow("基準日との比較（月数）", moment(dateB).diff(moment(dateA), 'months')));
arrRow.push(createRow("基準日との比較（年数）", moment(dateB).diff(moment(dateA), 'years')));
var month = moment(dateB).diff(moment(dateA), 'months') % 12;
arrRow.push(createRow("基準日からの計算（年と月）", moment(dateB).diff(moment(dateA), 'years') + "年 " + month + "ヶ月"));
arrRow.push(createRow("日時A < 日時B なのか", moment(dateA).isBefore(dateB)));
arrRow.push(createRow("日時A = 日時B なのか", moment(dateA).isSame(dateB)));
arrRow.push(createRow("日時A > 日時B なのか", moment(dateA).isAfter(dateB)));
arrRow.push(createRow("今日は日時Aと日時Bにあるか", moment().isBetween(dateA, dateB)));
arrRow.push(createRow("ほか", "-----"));
arrRow.push(createRow("今日", moment().format('YYYY-MM-DD')));
arrRow.push(createRow("ロケール", moment.locale()));
arrRow.push(createRow("言語", moment.lang()));
arrRow.push(createRow("UTC", moment(dateA).format('ZZ')));
// Appned tabel element
for (var i = 0; i < arrRow.length; i++) {
record['Table']['value'].push(arrRow[i]);
}
};
// Eventlist
var ev = ['app.record.create.show',
'app.record.edit.show',
'app.record.edit.index.show',
'app.record.create.change.DatetimeA',
'app.record.create.change.DatetimeB',
'app.record.edit.change.DatetimeA',
'app.record.edit.change.DatetimeB'
];
kintone.events.on(ev, function(event) {
eventDatetime(event);
return event;
});
})();