s 今から始めてすぐできる 新機能 IM-Spreadsheet Option ことはじめ 社内に蔓延している Excel 業務が生産性のボトルネックです! s 株式会社 NTTデータイントラマート開発本部プロダクトディベロップメントグループ s
1 自己紹介 名前宮脇駿 部署 担当業務 好きな IM 製品 開発本部 以下の製品の設計 フロントエンド開発 IM-Spreadsheet, IM-Knowledge IM-Spreadsheet
社内で Excel で回している業務 どれだけありますか?
Excel で回している業務の特徴 知らない間に増えている マクロを使いすぎてブラックボックス化してる! せっかくシステム化したのに Excel の方が使いやすかったとユーザから不満
某社のケース 1 ~ 進捗管理表を共有ファイルサーバ上で管理 ~ 進捗管理表 _8 月分.xlsx 進捗管理表 _8 月分 _20180723 更新.xlsx 進捗管理表 _8 月分 _ 田中.xlsx 進捗管理表 _8 月分 _ 最新 _20180731.xlsx 進捗管理表 _8 月分 _ 最新 _ 当日印刷用.xls
某社のケース 1 ~ 進捗管理表を共有ファイルサーバ上で管理 ~ IM-Spreadsheet 共有ワークブック機能を用いて実現
某社のケース 2 ~ 海外出張旅費申請書 ~
某社のケース 2 ~ 海外出張旅費申請書 ~ フロー図 IM-Spreadsheet ワークフロー連携サンプルを用いて実現
社内に蔓延している Excel 業務を IM-Spreadsheet で解決しましょう!
IM-Spreadsheetとは 3 分で作る! 既存帳票のワークフロー化スクラッチ開発での業務画面作成例今後のロードマップ
IM-Spreadsheet とは
IM-Spreadsheet intra-mart上でexcelのようなuiを実現するための スプレッドシート機能です 2018年6月リリース 共有ワークブック機能 BPM/ワークフローとの連携サンプル Formaアイテムを提供予定 SpreadJSライブラリを使用して実現
SpreadJS Grapecity 社が開発した Excel ライクな UI や自由なグリッド UI を実現するための Javascript ライブラリです Spread.Sheets Spread.Views Excel ライクな UI 自由なグリッド UI
Spread.Viewsの自由な表現 こちらのライブラリもIM-Spreadsheet のライセンスでご利用可能です 画像引用 http://demo.grapecity.com/spread/spreadjs/views/index.html#/tutorials/
IM-Spreadsheet の機能 1 フォントや罫線 セルの保護などの設定印刷インポート エクスポート履歴管理 外部公開設定 権限管理 共有ワークブック機能
IM-Spreadsheet の機能 1 IM-Knowledge 上での一覧表示 タグ クエリを用いた管理 検索 IM-ContentsSearch を用いた検索 共有ワークブック機能
IM-Spreadsheet の機能 2 スクリプト開発向け BPM/ ワークフロー連携サンプル
IM-Spreadsheet の機能 3 Forma アイテムとしての Spreadsheet DB 連携 データバインディング機能 IM-FormaDesigner 画面アイテム (2018 Winter より提供予定 )
IM-Spreadsheet の機能 共有ワークブック機能 SpreadJS ライブラリの利用 + ワークフロー /BPM 連携サンプル Forma 連携アイテム ( 2018 Winter より ) IM-Spreadsheet option for Accel Platform
3 分で作る! 既存帳票のワークフロー化 IM-FormaDesigner 連携 (2018 Winter より提供予定 )
3 分で作る! 既存帳票のワークフロー化 Excel で作られた既存の通勤交通費申請書を 3 分でワークフロー化してみましょう シンプルな直線ワークフローを作成し 画面を FormaDesigner と Spreadsheet で作成していきます 使用製品 IM-BIS IM-Workflow IM-FormaDesigner IM-Spreadsheet
今流したデモのポイントを振り返りましょう 既存の Excel 帳票をインポートすることで素早く画面化することが出来ました 続いて 実業務に適用する上でのポイントを紹介していきます
見た目のカスタマイズ グリッド線やヘッダの表示 非表示 セルの保護 スクロールバーの表示 非表示 など
データ連携 Forma 上で各セル テーブルにフィールド識別 ID を割り当てることで フォームデータとして扱うことが可能 申請者名 申請者住所 用途例 LogicDesigner で取得した値をセル テーブルの初期値として割り当てる 入力された値を LogicDesigner や Forma 後処理で利用し 独自 DB に保存する Forma 後処理で通勤区間と交通費の入力チェックを行う 交通機関運賃表
Forma-Spreadsheet連携機能のおさらい FormaアイテムとしてのSpreadsheetを利用することで 今までよりもより自由な表現が可能に 既存帳票をそのまま利用 グリッドテーブルの代替 シートの見た目は自由にカスタマイズすることが可能 データバインディング機能により シート内の入力項目を フォームデータとして利用することが可能 入力チェック 前処理 後処理でDB連携 LogicDesigner連携
スクラッチ開発における業務画面作成例
スクラッチ開発におけるIM-Spreadsheet これまでの内容 純粋なExcelファイルの編集 共有ワークブック機能 既存帳票の有効活用 グリッドテーブルの代替として Forma連携機能 スクラッチ開発におけるIM-Spreadsheet 大量データの扱い 複雑な作りの業務画面の実現 データベースとの連携 認可を絡めた権限管理 BPM/WFとの連携
期間ごとの絞り込み 表示単位の切り替え Excel ファイルのエクスポート コメントの挿入 セルの保護 カテゴリごとの折り畳み 列の表示 / 非表示切り替え
ポイント 1 データの読み込み 集計行の差し込み DB から取得したデータをクライアントサイド JavaScript で処理 行データを生成 実績 + 見込 や 達成率 の数値 関数を利用することで 余分なデータをサーバから取得する必要が無い 大量データの扱い パフォーマンス問題 今回は期間で選択することでサーバから必要なデータだけを取得するように実装数千行のデータを取得しても問題なく描画できるが クライアントスペック依存なので注意
ポイント 2 データの書き込み 入力チェック 今回はセルの変更を検出し 誤りがある場合は警告を出す実装 SpreadJS 標準の入力チェックや サーバ側の既存実装を使いまわすのも有効 データの書き込み セルの変更を検出し 製品 ID + 列 ID + セル値をサーバに送信しているので負荷は少ない Excel 出力機能を利用して サーバ側でExcelファイルをアーカイブすることも可能
スクラッチ開発における業務画面作成例のおさらい スクラッチ開発のポイント ページング処理を絡めて大量データに対応したデータ取得処理 SpreadJSの関数を使うことで集計行や割合の計算を省略 セル単位での入力を検知 更新することも可能 Excel入出力機能を利用して Excelファイルをアーカイブすることも可能 その他の応用 BPMやワークフローの画面として利用する 認可を利用した権限管理 IM-LogicDesignerでサーバ側の処理を高速開発 純粋にグリッドテーブルの代替として利用する
今後のロードマップ
今後のロードマップ 2018 Spring リリース 2018 Winter Forma 連携共有ワークブック機能強化 ユーザスクリプト 画面への埋め込み 2019 Spring 以降 SpreadJS V11 対応 チャート PDF 出力 同時編集機能 LogicDesigner 連携開発サンプル拡充
ユーザスクリプト 共有ワークブック機能強化 2018 Winter 以下のタイミングで任意のJavascriptを実行可能に 初期表示, 保存, インポート, エクスポート, 印刷 利用例 LogicDesignerと連携させ DB情報の一覧画面として利 用する 簡易な入力チェックを追加する セルの値変更時にサーバと通信する
iframe用の埋め込み部品の提供 共有ワークブック機能強化 2018 Winter 共有ワークブック機能で作成したワークブックを スクラッチ画面やiAPポータル等で表示 編集でき るようになります 利用例 ユーザスクリプト機能でLogicDesignerと連携させ DBで管理している売上情報の監視をポータルで行う
SpreadJS V11に対応します SpreadJS バージョンアップ対応 2019 Spring以降 2018/8/29にリリースされた SpreadJS V11Jの対応を行います チャート グラフ の対応 PDF出力対応 アウトライン列の対応 Undo, Redo機能強化など 引用 https://www.grapecity.co.jp/developer/spreadjs/release/11
おわりに
おわりに IM-Spreadsheet 共有ワークブック機能 Forma連携による既存帳票を利用した高速開発 スクラッチ開発の部品としてのSpreadsheet 今後の機能拡張の継続 本日ご紹介した内容でご不明な点やご質問等ございましたら お気軽にお問合せください
s s