鱧技術

hamo_daisukiの技術メモ

Alasql と grid.js でいろいろできないかな

製造現場からのリクエス

液体の商品(食品類や薬剤とか)の多い倉庫や、液体の入った配管の走る製造現場では無線LANの設置が難しいです。電波が液体を抜けにくいのです。ゆえに、そういう場所にウェブアプリを提案すると「オフラインでもある程度作業ができて欲しい」「現場で入力した内容は事務所に帰ってからまとめて送信したい」などの要望を聞くことが多いです。

現状、アプリの製作工数がかかってしまう、かつ、現場の方で微調整できる方法がなかなか見つからずモヤッとしていました。

注)アプリの微妙な変更(ボタンの大きさだったり、配置順、色など)は使う方が変更できるようにしたいと思っているので、もやもやが止まりません。たいしたことはやっていないので、なるべく現場サイドでいじれるようにしたいと思ってます。

参照用の動かないデータは1ページのhtmlにまとめる

現場作業においてデータ検索のみの要望に対しては、配列にデータを突っ込んで検索用の画面を作成した1ページのhtmlを作りスマホなどで持ち歩いてもらいました。ページの生成は AWK みたいな古いスクリプトでもできるし(シニアなエンジニアのさえた技が使えます)、deno みたな割と新し目な物でも出力可能です。オンメモリになりますが、占有10MB程度(?)でそれなりに使えるものができるので便利でした。

しかし検索条件が複雑になったり、複数のマスターを組み合わせるとつらくなります。検索結果の並べ替えも実装が面倒になってきました。

grid.jsAlasql を導入してみた

そこで、画面の実装で面倒な部分(並べ替え、ページネーションなど)は grid.js にまかせて、データのハンドリングは Alasql に投げてしまうことにしました。データ形式json で統一することにしました。

で、どこまで進みました?

一応、テストデータに住所録を使って、単一条件での検索と表示ができるようになりました。Alasql で絞り込んだデータを grid.js の search(まだ全文検索しかできませんが)で検索する感じになってます。Alasqlgrid.js も日本語の情報が少なくてなかなか厳しかったのですが、先が見えてきました。

業務では MS Access が幅を利かせているようなところですが、なんとか実装の定番パターンを見つけ、plan B を提案できるようにしたいところです。

ちかいうちにソースを公開できる程度にしたいです。