WEBツール＆ライブラリ | ワクガンス

ソートやページネーション機能を備える一覧を表示する。

「追加」、「編集」、「削除」は基本的なCRUD機能である。
ただ「削除」は削除フラグをONにするだけで実際にDBから消去するわけではない。
「抹消」はデータそのものをデータベースから消去する(DELETE)。 削除フラグがONのデータのみ抹消できる。（一度削除してから抹消という流れ）
「複製」機能は文字通りその行を複製する機能。



図1(追加)
図2(編集/複製/削除)
図3(抹消)

検索機能は2種類あり、メインの検索と詳細検索から構成されている。
メイン検索は複数の特定列（主に文字系）を検索対象にしている。 詳細検索は各列ごとに細かい検索指定ができる。

図

最初にページを開いた時の状態に戻す機能。
上部メニューに存在する ボタンを押すと、検索されている状態や、一覧ソートされている状態をリセットして初期状態に戻すことができる。
図

一覧の特定の列を隠したり、再表示したりできる機能。
図

当画面で保存しているセッションをクリアする機能。
図

一覧表示は2タイプあり、行列型と縦型が存在する。
行列型はPC向けであり、一般的な列と行からなるテーブル構造。 縦型はスマホ向けであり、各項目を縦に並べる。スマホで画面を開くと縦型になる。
上部メニューの ボタンを押すことで切替ができる。
図

データ数（行数）が増えた時、ページ分けする機能。目次が表示される。
検索機能の「表示件数」で1ページに表示する行数を指定できる。
図

まとめて削除および有効にする機能。
一覧の左側チェックボックスにチェックを入れ、一覧の下にある「削除」または「有効」ボタンを押す。
図

一覧の列名リンクをクリックするとその列のデータで昇順並べ替えを行う。
もう一度クリックすると降順並べ替えを行う。
並べ替え状態は「初期戻し機能」で解除することができる。
図

行を入れ替える機能。
一覧の左側に存在する↑↓ボタンをクリックを押すと、 行入替フォームが現れ、行を上下に移動させたり、指定位置にジャンプさせたりできる。
図

当システムには一般モードとログインモードが存在する。
一般モードはログインなしでデータの編集が可能。
ログインモードにするとログインを必要とする画面になる。
図1 図2 図3

一覧をCSVファイルとしてダウンロードできる。
設定内（押下）のCSVエクスポートボタンでCSVダウンロードする。
検索による絞り込みを行った場合、出力されるCSVファイルのデータも同様に絞り込まれる。 ただし検索の表示制限の影響は受けない。検索結果はすべて出力される。（LIMIT制限なし）

ログインユーザーを管理する画面。
システムにログインするユーザーのアカウントを追加、編集、削除することができる。

ユーザー管理画面の図例

権限について

ユーザーの権限は複数あり、マスター、管理者、クライアント、オペレータがある。
上位権限者は下位権限者の変更（追加、編集、削除）が可能。 例えば管理者権限ユーザーはクライアントユーザーとオペレータユーザーを変更できる。
マスター権限ユーザーであればすべてのユーザーを変更することができる。
下位権限であるオペレータは他のユーザーの変更はできず、ユーザー管理画面自体にアクセスできない。

パスワードについて

セキュリティのためパスワードは暗号化してＤＢに保存している。複合化(※)はできない。
そのため、パスワードを入力したユーザーしかパスワードを知りえないという仕様になっている。
もしパスワードを忘れた場合は上位権限者が再設定するという仕様になっている。
ユーザー管理画面にパスワードらしき文字列が表示されているが、これは暗号化された文字列である。

編集フォームや新規入力フォームからファイルアップロードができる。プレビュー画像をクリックするとファイル選択ダイアログが開く。
独自で開発したJSライブラリ 「FileUploadsK.js」を使っており、 ドラッグ＆ドロップや画像プレビューなどに対応している。

一覧の行に「編集」ボタン、「複製」ボタンなどいくつかボタンが存在しているが、 これらのボタンはボタンサイズ変更機能で大きさを変更することができる。ボタンが小さくて押しにくい場合に便利な機能。

Excel表からコピペしたデータを一括登録できる機能。
下側のセレクトボックスやテキストボックスの入力は、一括登録するデータすべてに適用される。
登録するデータをプレビュー表示してからDB登録という流れなので誤操作を軽減できる。

フロント画面は一般公開用の閲覧画面。
管理画面で検索条件の絞り込みが行われている状態で フロント画面ボタンを押すと、検索状態がフロント画面とそのURLにも反映される。

フロント画面