交通費申請を行う社内システムを作成するためのテンプレートです。
●交通費申請をkintoneで一元管理
ユーザー登録された従業員なら誰でもフォームから交通費を申請できます。同時にkintoneアプリにも登録されるため、交通費の承認も簡単になります。
●従業員自身で申請内容を確認・修正できる
kintoneに登録された申請内容を従業員本人のみに公開できます。従業員はシステムにログインして、自分の申請内容をいつでも確認・修正できます。
テンプレート内容
①kintoneアプリテンプレート
- 交通費申請パック
②FormBridgeテンプレート
- 交通費申請フォーム
③kViewerテンプレート
- 申請済み交通費ページ
テンプレートをダウンロードし、以下の手順で設定を行います。
Step1. kintoneでアプリを作成する
1. テンプレートをアップロードしてアプリを作成する
- kintoneのアプリ作成画面で「交通費申請パック」をアップロードしてアプリを作成します。
▼「交通費申請アプリ」と「従業員名簿アプリ」の２つのアプリが作成されます
2. 従業員名簿アプリにレコードを追加する
- このシステムを利用する従業員の情報をレコードに追加します。
以上でStep1は完了です。
▼交通費申請アプリの完成イメージ
▼従業員名簿アプリの完成イメージ
Step2. FormBridgeで交通費申請フォームを作成する
1. テンプレートをアップロードしてフォームを作成する
- FormBridgeのフォーム作成画面で「交通費申請フォーム」テンプレートをアップロードします。
- 基本情報の登録画面で、Step1で作成した「交通費申請アプリ」の情報を入力し、フォームを作成します。
2. 交通費申請フォームにユーザー管理を設定する
- サイドメニューから[ユーザー管理]の設定を開きます。
- [kintone同期]をクリックします。
- Step1で作成した「従業員名簿アプリ」の情報を入力し、次へ進みます。
- [kintone列]に「メールアドレス」を選択して次へ進み、[保存して同期]をクリックします。
3. ユーザー管理の時間指定同期を設定する
- [kintone同期]の設定で、[自動同期設定]＞[時間指定同期]の項目を編集します。
- 好きな時間間隔を設定して保存します。
4. ユーザー管理のWebhook同期を設定する
- 続いて、[自動同期設定]＞[Webhook同期]の項目を編集します。
- [Webhookを利用する]にチェックを入れ、[Webhook URL]をコピーします。
- kintoneで、「従業員名簿アプリ」のWebhook設定画面を開きます。
- [＋追加する]をクリックし、[WebhookURL]の入力欄にコピーしたURLを貼り付けます。
- [通知を送信する条件]で、[レコード追加][レコード編集][レコード削除]の3箇所にチェックして保存し、kintoneアプリを更新します。
- FormBridgeの設定に戻り、フォームを公開します。
以上でStep2は完了です。
▼交通費申請フォームの完成イメージ
Step3. kViewerで申請済み交通費ページを作成する
1. テンプレートをアップロードしてビューを作成する
- kViewerのビュー作成画面で「申請済み交通費ページ」テンプレートをアップロードします。
- Step1で作成した交通費申請アプリの情報を入力し、ビューを作成します。
2. 申請済み交通費ページにユーザー管理を設定する
- サイドメニューから[ユーザー管理]の設定を開きます。
- [kintone同期]をクリックし、[kintone同期設定]を開きます。
- Step1で作成した「従業員名簿アプリ」の情報を入力し、次へ進みます。
- [kintone列]に「メールアドレス」を選択して次へ進み、[保存して同期]をクリックします。
3. ユーザー管理の時間指定同期を設定する
- [kintone同期]の設定で、[自動同期設定]＞[時間指定同期]の項目を編集します。
- 好きな時間間隔を設定して保存します。
4. ユーザー管理のWebhook同期を設定する
- 続いて、[自動同期設定]＞[Webhook同期]の項目を編集します。
- [Webhookを利用する]にチェックを入れ、[Webhook URL]をコピーします。
- kintoneで、「従業員名簿アプリ」のWebhook設定画面を開きます。
- [＋追加する]をクリックし、[WebhookURL]の入力欄にコピーしたURLを貼り付けます。
- [通知を送信する条件]で、[レコード追加][レコード編集][レコード削除]の3箇所にチェックして保存し、kintoneアプリを更新します。
5. 交通費申請フォームと連携する
- kViewerに戻り、サイドメニューから[FormBridge]の設定を開きます。
- [フォームブリッジと連携する]にチェックします。
- [フォームのURL]にStep2で作成した「交通費申請フォーム」のURLを入力します。
- [ラベル]に「申請内容を修正」と入力して保存します。
- ビューを公開します。
以上でStep3は完了です。
▼申請済み交通費ページの完成イメージ
Step4. 回答完了後に申請済み交通費ページに遷移できるようにする
1. FormBridgeで交通費申請フォームの回答完了画面を設定する
- サイドメニューから[回答完了画面]の設定を開きます。
- [HTML]入力欄の＜ここに申請済み交通費ページのURLを貼り付けてください＞の部分に、Step3で作成した申請済み交通費ページのURLを入力します。
- フォームを更新します。
▼回答完了画面の完成イメージ
以上で交通費申請システムの設定は完了です。
