LINEbotとGASを連携させてスプレッドシートで勤怠管理と給与計算してみた
1. 概要
某アプリでの勤怠管理は誤差が出てしまうのでちゃんと作って管理できたらな。というのに加えてGASとかLINEbotとか触ったことないから何か作ってみたかった。
2. 要件
- LINE公式アカウントから「出勤」「退勤」を打刻
- 退勤時には労働時間と給与を出力
- スプレッドシートで管理
3. 下準備
スプレッドシート
まずはGoogleDriveにアクセスします。
画面左上の 「新規」 をクリックします。
「Googleスプレッドシート」 を選択
するとスプレッドシートが開くので、
「拡張機能」
「Apps Script」
を選択します。
するとスクリプトエディタが開き、コードが書ける状態になります。
LINE公式アカウント
以下のURLにアクセスします。
画面右上から 「ログイン」 を選択
LINEアカウントでログインします。
QRコードかメールアドレスとパスワードのどちらかでログインします。
Developer nameとYour emailに適当な名前とメールアドレスを入力し、チェックボックスをオンにしたらCreate my accountで作成できます。
このような画面になりました。
4. GASの準備
4.1. コードを書く
スクリプトエディタを開き、以下のようなコードを記述します。
punch.gsに出てくるスプレッドシートのIDは以下のURLのxxxxxの部分を入れて下さい。
https://docs.google.com/spreadsheets/d/xxxxx/edit~
// シートの読み込み
const ss = SpreadsheetApp.openById("xxxxx");
const sheet = ss.getSheetByName("シート1");
const lr = sheet.getLastRow();
// ここが起動
function doGet() {
// 出勤時刻入力
if (is_punchin()) {
const time = new Date();
sheet.appendRow([time]);
}else{
// 退勤時刻入力
const punchout = new Date();
const poutStr = Utilities.formatDate(punchout, 'JST', 'yyyy/MM/dd HH:mm:ss');
sheet.getRange(lr, 2).setValue(poutStr);
// 労働時間計算・入力
const pin_ms = new Date(punchin_time()).getTime();
const pout_ms = new Date(punchout_time()).getTime();
const diff_ms = Math.abs(pin_ms - pout_ms);
const diff_hours = cal_hours(diff_ms);
sheet.getRange(lr, 3).setValue(diff_hours);
// 給与計算・入力
const salary = 1000; //ここに時給
sheet.getRange(lr, 4).setValue(diff_hours * salary);
}
}
function is_punchin () {
return sheet.getRange(lr, 2).getValue() == "" ? false : true;
}
function punchin_time () {
return sheet.getRange(lr, 1).getValue();
}
function punchout_time () {
return sheet.getRange(lr, 2).getValue();
}
function cal_days (diff_ms) {
return diff_ms / 1000 / 60 / 60 / 24;
}
function cal_hours (diff_ms) {
return diff_ms / 1000 / 60 / 60;
}
function cal_minutes (diff_ms) {
return diff_ms / 1000 / 60;
}
function cal_seconds (diff_ms) {
return diff_ms / 1000;
}
ファイルの追加は画面左の＋ボタンから。
4.2. デプロイする
画面右上の 「デプロイ」→「新しいデプロイ」 をクリック
「ウェブアプリ」 を選択
「新しい説明文」「次のユーザーとして実行」「アクセスできるユーザー」をそれぞれ選択しデプロイする。
デプロイが完了しました。
ここで表示されたURLをメモしておきます。
5. LINEの設定
5.1. 友だち追加する
「新規プロバイダー作成」 をクリック
適当なプロバイダー名を入力し作成する
Messaging APIを選択
「チャネルの種類」「プロバイダー」「地域」「チャネルアイコン」を入力
「チャネル名」「チャネル説明」「大業種」「小業種」
各種利用規約にチェックを入れて作成
確認されるので「OK」とする
これも同意
もう一度同意する
ページ中央のMessaging API設定を選択し、表示されたQRコードを読み取り友だちになる。
5.2. リッチメニューの作成
以下のURLから公式アカウントにログインします。
画面左を下にスクロールすると出てくる 「リッチメニュー」 を選択し、作成をクリックします。
5.2.1. 基本設定
適当なタイトルと表示期間を決めます。
5.2.2. コンテンツ設定
テンプレートの横にある 「選択」 をクリックし、適当なテンプレートを選択します。
画像の横にある 「設定」 を選択し、今回は画像を用意していないので 「エリアごとに画像を作成」 を選択しました。
作成したら 「適用」 をクリックします。
「メニューバーのテキスト」「メニューのデフォルト表示」を選択
「保存」をして完成です。
6. 結果
このような感じになりました。
7. まとめ・感想
小数点以下が計算され過ぎてしまっていたり、深夜割だったりとまだ十分でない点が残っているので今後少しずつ改善したいと思います。LINEで開いた時エラーが発生しましたと表示されてしまったり、スプレッドシートの労働時間が分かりにくかったり、あとは15分で切り捨てみたいなオプションもあればなお良いかも。(メモ)
ボタン一つで出勤か退勤かをシステム側で判断できるようになっているのはユーザビリティが良いと感じます。
Discussion