備品貸出管理フォーム

Google Apps ScriptおよびそのHTML Serviceで作成した備品類の貸出申請および管理をする為のウェブアプリケーションです。社内で運用をする上で必要な機能を概ねカバーしています。

通常よくありがちなスプレッドシート上での管理をさせずに、フォーム上で完結するよう作成されています（スプレッドシートはプログラム用のセッティングやデータ管理のギミックのためのシートなので、下手に触ると整合性が失われるので、基本は管理フォーム側で管理するようにしてください）。

一般社員向けの申請フォームと、管理者側の管理フォームの２つを装備しています。ただし、現行このフォームは関西と関東の２つの配送拠点にだけ対応しているので、さらに配送拠点を増やしたい場合にはカスタマイズが必要です。それ以外については、スプレッドシート上の設定値をセットアップするだけで動作します。

このプログラムの構成ファイル

プログラム本体とテンプレート

• 備品貸出予約フォーム - プログラム本体（フォーム2個と共通設定用の1個の計3個のプロジェクトで構成）
• 備品貸出申込みテンプレート - 印刷用・PDF生成用のテンプレートファイルです。名前付き範囲が設定されています。
• 関東ファイル - 関東拠点用のデータ管理用スプレッドシートです。
• 関西ファイル - 関西拠点用のデータ管理用スプレッドシートです。

これら4つで本プログラムは構成されています。コピーしてお使いください。

プログラム内で利用してる各種ライブラリ

• jQueryライブラリおよびjQuery UIライブラリ - Google CDNを利用
• CSS Package for editor add-ons - 一部のボタン類のデザイン用CSS
• Timeline.js - 予約状況をスクローラブルなガントチャート形式で表示するタイムラインライブラリ
• w2ui - jQueryプラグインとして動作するdatagridライブラリ
• Visualization API - Google製のデータをグラフ化する為の高機能ライブラリ

その他細かなCSSを外部呼び出して利用しています。各ライブラリはこのサーバ上に配置しているものを現在は利用しているので、本番で可動を考えるのであれば、上記ライブラリ類をhttpsの利用できるWebサーバ上に配置して、プログラム内で参照してるライブラリのURLを書き直して使う事をオススメします。

セットアップ

プロジェクト作成

Cloud Consoleの設定

本プログラムはPicker APIを利用している為、Google Cloud ConsoleにてPicker APIを追加する作業が必要です。そのため、備品貸出フォーム側プロジェクトには、Cloud Platformプロジェクトと紐付け作業が必要です。以下の手順で設定しましょう。

1. Google Cloud Consoleを開く
2. 左上にある▼をクリックする
3. ダイアログが出てくるので、新規プロジェクトを作るか？既存のプロジェクトを選択する。この時、G Suiteであれば選択元は「自分のドメイン」を選択する必要があります。
4. プロジェクト情報パネルから「プロジェクト番号」をコピーする
5. 対象のGoogle Apps Scriptのスクリプトエディタを開く
6. 「リソース」⇒「Cloud Platform プロジェクト」を開く
7. 4.で入手した番号をプロジェクトを変更のテキストボックスに入れて、プロジェクトを設定ボタンをクリックする
8. 無事に移動が完了すればメッセージが表示されます。
9. この時、元の自動作成されたプロジェクトはシャットダウンされて消えます。これで設定完了です。

図：プロジェクトを他のプロジェクトに紐付けしました。

Picker APIを追加

APIを有効にする

前項で作成したプロジェクト内にて、Picker APIの追加が必要です。この後のセットアップで使用するファイルとフォルダの指定にて利用するためです。以下の手順でAPI Keyを入手します。

APIとサービスのダッシュボードより「APIとサービスの有効化」よりサービスを探して、有効化します。検索画面より「Picker」と入れると、Google Picker APIが見つかります。このAPIは引き続き認証情報を作成する必要があります。

図：Picker APIはよく使うので1個取っておくと良いでしょう

認証情報を作る

引き続き認証情報を作る必要があるAPIがあります。左サイドバーの「認証情報」より作成開始します。ここで作成するのはAPIキーと呼ばれる単一のコードで、Google Maps APIなどでもよく使っていた１行の文字列です。

プロジェクトへの認証情報追加画面にて、必要な認証情報ボタンをクリックするとすぐにAPIキーが生成されます。これをAPI利用時に使いますので、取っておきます。他人に知られてはなりません（キーに対してHTTPリファラーでの制限を加えると良いです）。キーは再生成も可能です。

図：APIキーをゲットしたらAPIが利用できます。

プログラムの設定

ライブラリの設定

本プログラムは2つのフォームを1つの設定値を共有させる為に、3つ目のプロジェクトとして共通化した「備品管理ライブラリ」というプロジェクトを持っています。設定値はこの3つ目のプロジェクトのスクリプトプロパティに書き込まれます。以下の手順でこのプロジェクトをライブラリ化して、申請フォーム側および管理フォーム側にライブラリとして、識別子は「setman」で追加が必要です。

ライブラリ化と追加の手順はこちらのページを参照してください。

図：3つのプロジェクトで構成されています

サイドバー設定

サイドバー設定にはプログラムで使用する各種設定が含まれています。利用前にセットアップをしましょう。また、セットアップを行なうためには、一度スクリプトエディタに入り、「onOpenを実行」して承認作業を済ませてからでないとセットできないので、ご注意ください。

メニューより「セッティング」⇒「管理設定」で入ります。

主な設定は

1. このサイドバーで利用するPicker用のAPI Keyセット項目（これを一番最初にセットアップしましょう）
2. 管理者通知アドレス（申請時にメールを飛ばす先のメアド）
3. 関東ファイルおよび関西ファイルの指定用設定
4. 備品申込みテンプレート指定
5. ファイルの保存場所フォルダの指定 - フォルダ内に施設リスト毎に新たにフォルダが作られます
6. PDFの保存場所フォルダの指定

となっています。

シート上の設定

シート上でセットアップする作業としては以下の３点。

1. プログラム本体（備品貸出予約フォーム）の予約者リストに利用者のメアドとデフォルト配送拠点の設定
2. 同じくプログラム本体の設定シートに登録支店・施設名を追記します。
3. 関東ファイルおよび関西ファイルの貸出資材シートに備品類の登録をしておきます。IDは必ず連番で登録すること。

基本備品類はスプレッドシートに追記するだけで管理が可能です。

また、おなじく「ツール」には、管理機能として以下の機能が備わっています。

1. トリガー設置 - 設置すると回収済みの機材データを自動で過去ログ側へデータを移動させます。
2. 在庫チェッカー - 指定した機材の現在の在庫状況を確認するダイアログです。
3. ファイル出力 - 年度更新の時期にだけ実行し、現在までに完了してる貸出データをファイルとして切り出します。切り出し後は現在続行中のデータのみが残ります。

ウェブアプリケーション

本プロジェクトは、ウェブアプリケーションとして動作します。実際に利用する場合には、ウェブアプリケーションとして公開する作業が必要になります。以下の手順で公開し、一般社員向けには申請フォーム側のURLを、管理者は管理フォーム側URLを渡すようにしましょう。

1. スクリプトエディタのメニューより、「公開」⇒「ウェブアプリケーションとして公開」
2. 次のユーザとしてアプリケーションを実行で誰の権限で動かすかを指定する。自分かアクセスしてるユーザの二択。後者の場合、ユーザはGoogleアカウントを持ってる必要があります。
3. アプリケーションにアクセスできるユーザを指定する。自分のみ、全員、全員（匿名含む）の三択。但し、全員の場合はGoogleアカウントが必要で、匿名含むの場合は、Googleアカウントなしでアクセス可能です。
4. 最後に導入すると、ウェブアプリケーションのURLが取得できます。このURLでアクセスをします。URLの最後がexecが本番用、devがテスト用で、テスト用は最新のコードをテストのリンクを踏むと表示されますが、変更したコードがそのまますぐに反映されてしまうので、テスト用のURLで運用しないように。

コメントアウト解除

今回のプロダクトは、サンプル用に１箇所の関数でコメントアウトをしてある箇所があります。備品貸出フォームプロジェクトに於ける「index.html」の294行目にある「requery関数」内です。これは予約者シートにメアドの登録のない者には利用できないようロックを掛ける部分です。

現在はコメントアウトしてあるため、ロック解除の状態です。実運用時には必ずコメントアウト解除しましょう。

フォームの使い方

備品貸出フォーム

申請フォームは一般社員が使うメインのフォームです。現在の貸出状況がスクローラブルなタイムラインで開かれます。関東・関西で借りる機材は異なるので、機材単位で申請を両方でも可能です。また、残りの機材数もきちんと管理しているので、申請時に残が0の場合、申請ができません。

タイムラインは赤が仮予約、緑が確定してる状態を示し、クリックすると詳細の情報が出てきます。また、タイムラインは常に現在時刻が中心に来るようになっています。タイムラインでの混雑具合を確認しながら、申請を行なうようにしましょう。

予約は左下の「レンタル予約」をクリックすることでスクショのようなダイアログが出てきます。使い方は

1. 施設と期間入力で、申請者の名前や電話番号、貸出開始日・納入希望日、貸出終了日・返却予定日を入れます。この時、5日間のバッファを自動で取るようにしているので、貸出開始日 > 納入希望日、貸出終了日 > 返却予定日として日付を入れる必要があります（このバッファは移動や実運用までの予備日数として取っています）
2. 備品の登録では選択した配送拠点毎の貸出機材一覧が出てくるので、選択します。
3. また、台数と用途を記入します。複数項目まとめて申請が可能です。
4. 最後に予約を送信ボタンをクリックすると、管理者に申請が送られます。この段階では仮予約の段階です。申請者および管理者にメール通知とPDFファイルが送信されます。
5. 管理者が承認すると、確定となります。

1.の期間が癖があるので、ご注意ください。自分で作っておいてよく間違えます・・・・そういう仕様で要望されたために・・・

図：ちょっと癖があるかもしれんです

備品貸出管理フォーム

管理フォームは申請が来た場合、返却をされた場合の２回に分けて利用します。

• 申請が来た場合 - 対象の申請を開いて確定するか？却下するかを選びます。申請者に通知が来ます。確定しないと他の方の申請に影響がでるので、速やかに申請しましょう（機材の残数はこの時点で確保されてる状態です）
• 返却された場合 - すみやかに対象の申請を「回収済み」に変更しましょう。回収済みにしないと、機材の残数は回復しません。

この２つだけです。また、サブ機能として、カレンダーチャートでの申請の混み具合、日別クロス集計フォームが使えるようになっています。また、関西・関東のそれぞれ別れているので、承認作業で忘れないでください。

図：管理フォームは２段階で利用することになります。

改訂履歴

2020/01/15 - Version 2.0

• • Google Pickerの仕様変更に対応しました