2022年度 三菱電機ソフトウエア技術レポート
スマート生産 電子報告書システム開発
1. まえがき
三菱電機ビルソリューションズ（株）（以下、MEBSと呼ぶ）では、約44万台／年（2021年4月現在）の空調・冷熱機器メンテナンス契約実績があり、メンテナンス作業の報告は紙の様式で作成し、依頼主（ビルオーナー、代理店等）へ報告している。このメンテナンス報告をWEBシステム化することで報告の効率化及び紙の削減につながる。
このシステム全体をスマート生産システムと呼び、このスマート生産システムの中でメンテナンス作業の報告書作成及び依頼主へ報告書を提出する機能を電子報告書システムと呼ぶ。
本稿では、電子報告書システムの概要、WEBシステムの開発で採用したソフトウェアのAngularフレームワークの特徴や従来のフレームワークとの違い、メンテナンス報告作業をシステム化したことによる業務の改善点について紹介する。
2. 電子報告書システムについて
2.1 システム概要
電子報告書システムは「報告書作成機能」「報告書ダウンロード機能（お客様向け）」のWEBサーバーからなる。
報告書作成機能は、MEBS社員とビルメンテナンス作業を委託している協力会社の作業員がWEBサーバーから修理及び保守の作業結果を報告書フォーマットに従って入力する。
報告書ダウンロード機能は、作業員が作成した報告書を依頼主がPDF形式でダウンロードし、内容を確認する。
システム構成を図 1 システム構成に示す。
図 1. システム構成
2.2 作業員の利用シーン
作業員が利用する流れを下記に示す。
- ① 依頼にもとづき修理・保守を実施する
- ② 電子報告書WEBサーバーで報告書を作成する
- ③ 報告書プレビュー画面でお客様へ作業内容を説明し、承認サイン（電子サイン）をいただき報告書を保存する
- ④ お客様向けWEBサーバーに報告書を公開する
2.3 依頼主の利用シーン
作業員が利用する流れを下記に示す。
- ① お客様メールアドレスに報告書ダウンロードURL及びログインID/PWのメールが届く（別々のメールで送付）
- ② 報告書ダウンロード用URLにアクセスしログインする
- ③ 報告書ダウンロード画面に報告書一覧が表示され、必要な報告書を選択しダウンロードする
2.4 特徴的な機能
従来の運用をWEBシステム化するにあたり作成した機能について説明する。
2.4.1 作業内容情報表示
従来は作業内容がFAX等で作業員に送付されていたが、WEBシステムで直接内容が参照できるうにした。
2.4.2 オフライン機能
修理・点検作業の際は、電波が届かずインターネット接続ができないところでの作業も想定される。作業員は報告書作成画面を開きながら作業中に電波の届かないオフライン環境に移動しても意識せずに報告書の作成が継続でき、修理・点検結果の保存を行えるようにした。オフライン時に保存された場合には、ブラウザ機能IndexedDB内に保持し、オンラインになった際にWEBサーバーに対して修理・点検結果を登録できるようにした。（図 2 オフライン動作イメージ）
図 2. オフライン動作イメージ
2.4.3 電子サイン
従来、作業員は作業完了後に複写式の紙の報告書に依頼主の確認サインを受領していたが、WEBブラウザ上で入力できるようにした。依頼主のサイン受領時にはスマートフォン画面やPCに接続したペン付きタッチパッドでの入力も可能とした。（図 3 電子サイン画面）
図 3. 電子サイン画面
図 4. サイン用タッチパッドイメージ
2.4.4 定型文・履歴入力機能
修理・点検作業では同じような文言や前回作業と同様の内容を入力することも多く、あらかじめ整備した定型文や過去に入力した内容を履歴一覧から流用して入力できるようにした。
2.4.5 ナビゲーション機能
作業内容により報告書の項目数が多く、目的の項目へ素早くたどり着けるようナビゲーション機能を追加し、項目名をクリックすることで簡単に入力欄にジャンプできるようにした。
3. WEBシステム化による改善点
WEBシステム化により改善した内容についてまとめる。
3.1 修理・点検作業の改善効果
従来とWEBシステム化後で修理・点検作業の改善効果を以下に比較してまとめる。
| 改善項目 | 従来 | WEBシステム |
|---|---|---|
| お客様への報告書送付 | お客様へ紙の報告書を作業員が手渡し、郵送またはFAX送付 | システム上から報告書ダウンロードURLをメール送付又はFAX送付 |
| 依頼元への報告書送付 | お客様への報告とは別に依頼元に対して報告書を郵送・FAX送信機で作業員が送付 | システム上からお客様への報告と同時に、報告書ダウンロードURLをメール送付又はFAX送付 |
| サポート部門への連絡 | 社内サポート部門への報告が必要な際には、事務所に戻ってから電話またはメールにて連絡を行っていた | 現場で作業完了後にシステム上からお客様への報告と同時に、連絡事項を記入しメール送付できる |
| 基幹システムへの実績連携 | 作業完了後に、基幹システムにログインし作業実績を入力 | システム上で作成した報告書のデータから作業実績を自動で基幹システムに連携 |
| 報告書の見やすさ | 現場での作業で報告書を書きづらい場合があり、報告内容が見づらい場合があった | 統一されたフォントで報告書が作成され、みやすい報告書が作成できるようになった |
| 報告内容の統一 | 作業員により報告の内容や粒度が異なることがあった | 定型文や履歴を参照できることで報告内容や粒度に統一感のある報告ができるようになった |
4. WEBアプリケーションフレームワークについて
今回のスマート生産システムの開発では、WEBシステム開発のフレームワークとしてAngularを採用した。
4.1 Angular概要
AngularはTypeScript上に作られたWEBアプリケーションのフロントエンド（クライアント側機能）開発を行うためのフレームワークで、以下に述べる開発に必要な一通りの機能を備えたフルスタックのフレームワークであり、それ以外にもコードの作成、ビルド及びテストを支援する開発者用ツールも備えている。
また、Angularの特徴として下記がある。
-
●
シングルページアプリケーション（SPA）
WEBブラウザ側で最初に画面情報を読み込み、必要な情報だけ非同期通信で読み込むため、操作感を通常のアプリケーションに近づけることができる（図 5 従来WEBページ表示、図 6 SPA WEBページ表示） -
●
フルスタックフレームワーク
多くのUI機能や通信機能などWEBアプリケーション開発に必要な機能、コンポーネントがそろっている -
●
コンポーネント指向
画面や機能を部品ごとに分割して開発を行える
図 5. 従来WEBページ表示
図 6. SPA WEBページ表示
4.2 開発への適用
今回、スマート生産システムへのAngular適用で以下のようなメリットがあった。
図 7. 従来とAngular開発の違い
-
①
フロントエンドとバックエンドを分けて開発
従来Javaもサービス層、ロジック層、DAO層等分けて、インターフェース形式で実装もできたが、JSPとAction層の結びつきが強く処理の切り分けが難しい場合があったが、Angularを利用しての開発ではより処理の切り分けが明確になり、担当者を分けて開発できた。（図 7 従来とAngular開発の違い） -
②
TypeScriptの利用
TypeScriptの利用には、学習のための初期コストがかかるが、JavaScriptと比較して次のメリットがある。- ・ コンポーネント単位で開発が行える
- ・ クラス化して処理を整理しやすい
- ・ 変数型誤りを事前にチェックできる
- ・ ソースコードが読みやすい
また、デメリットとして開発スタート時はAngular開発経験者が少なく学習の必要があったが、開発が進むにつれて開発効率化につながっていった。
4.3 WEBアプリケーション開発の改善効果
Angularを利用しての開発改善効果を以下に比較してまとめる。
| 改善項目 | 従来 | 本開発 |
|---|---|---|
| 開発作業の分業化 | HTML（画面）とJava（サーバ処理）が同一の開発者が実施していた | HTMLとJavaの担当者を分けて開発を進められた |
| JavaScript（TypeScript）開発／デバッグ | テキストエディタでコーディングし、ブラウザの開発者ツールでデバッグを行っていたため、実行しないとコードのエラーがわからなかった | ソースコードエディタVSCodeでコーディング及びデバッグ作業をおこなえたため、コードの型チェックやエラーなどが実行しなくてもわかる |
| 画面コードメンテナンス性 | プロジェクト毎に1ファイルに複数の機能（関数）を開発していたため、他プロジェクトにそのまま流用ができない | 1ファイルに1機能（クラス単位）で開発するため、他プロジェクトにそのまま流用できる |
5. 今後の展開
本システムは継続して開発を進めており、改善点をまとめて今後の開発のための参考とする。
5.1 基幹システム連携
本システムは基幹システムとの連携からの多くのデータを結びつける必要があった。同じ意味合いのデータが様々な基幹システムのDBに存在し、どのデータを使うべきか何度も確認をしながら開発を進めてきたが。今後は、項目ごとのデータ定義やつながりを細かく確認していき後戻りを少なくしていきたい。
6. むすび
電子報告書システムは、2020年のプロトタイプ開発から含めて、本番運用開始まで2年近くの開発となったが、従来の業務フローの確認から基幹システムの運用、基幹システムのデータ等、空調・冷熱機器メンテナンスについての数多くの情報をまとめ開発をすることができた。
最後に、現在も各種報告書フォーマットに対する開発を進めているが、本システムの開発機会を与えていただいた三菱電機ビルソリューションズ（株）の関係各位に深く感謝の意を表する。
| 【商標】 |
OracleとJava、JavaScriptは、オラクルおよびその関連会社の登録商標です。その他の社名、商品名等は各社の商標または登録商標である場合があります。 |
|---|---|
| 【参考文献】 |
|