【コピペでOK】自作のシフト提出フォームでスプレッドシート×カレンダーを自動連携
はじめに
本記事では、スプレッドシートをDBとして、自作のシフト提出フォームを作成し、シフトを提出する事でGoogleカレンダー、スプレッドシートに結果を反映させるプログラム(自作フォーム)をご紹介しています。
本プログラムはコピペで実装可能です。
今回完成するフォームをテスト利用してみたい方は以下のリンクからアクセスしてみてください！！「https://script.google.com/a/macros/gyoumukouritu.net/s/AKfycbw2vUlp_y8iYEl8hJFpvMya-MNLQs2IaESEQd5-NeEYOfj2RxlRxqUSlBKfanOyIv2O/exec」
お知らせ
ココナラでスプレッドシートを始めwebアプリ、Windows(mac)アプリ開発などのサービスを販売しているので、「こんなアプリが欲しい！！」「自動、業務効率をあげたい！！」というご要望があればいつでもお待ちしております！！
実装機能
・PC、スマホからのシフト送信
・Googleカレンダーへの自動反映
・スプレッドシートへの反映
完成イメージ(PC)
以下が初期表示になります。
「シフト追加」ボタンを押下する事で入力欄を追加する事が可能です。
削除したい行の「削除」ボタンを押下する事で取り消し可能です。
シフトの入力後、「シフト提出」ボタンを押下する事でシフトの提出が可能です。(表示されるまで少し時間がかかります。)
無事に提出が完了すると以下のポップアップが表示されます。
退勤希望時刻が出勤時刻より前の場合など、不正な値が入力された場合は以下のようにエラーのポップアップが表示されます。
送信されたシフトは連携されたスプレッドシートに記載されます。
今回はカレンダーとも連携しているため、カレンダーにも記載されます。
完成イメージ(スマホ)
以下が初期表示になります。
PC版と同様でシフトを入力し、「シフト提出」ボタンを押下する事でシフト提出が可能です。
シフト提出後は以下のようなポップアップが表示されます。
こちらも提出した内容はスプレッドシート、カレンダーに記載されます。
スマホで表示できない場合
スマホで表示した際に以下の様な画面が表示された場合は、お使いのブラウザで複数のGoogleアカウントでログインされていることが原因になります。
一度全てのアカウントでログアウトを行い、その後に一つのアカウントでログインを行ってください。
事前準備(シートの用意)
使用するスプレッドシートに以下の名前のシートを用意します。
・提出シフト
先ほど作成した「提出シフト」シートのA1セルに「氏名」、B1セルに「出勤希望日」、C1セルに「出勤希望開始時間」、D1セルに「退勤希望時間」を用意します。
次にカレンダーの登録を行います。
「その他のカレンダー」の「＋」を押下し、新しいカレンダーを作成します。
今回は「シフト提出」の名前で作成します。
プログラムのコピペ
拡張機能の「Apps Script」を押下し、エディタを開きます。
エディタを開いたら、左側上の「＋」から「HTML」を選択します。
作成するファイル名は「index」としておきましょう。
先ほど作成した「index.html」に以下のプログラムをコピペします。
ここから先は
¥ 150
この記事が気に入ったらチップで応援してみませんか？