demo: 労働者一覧画面 現在の状況まで一覧で出すと大変なことになりそうなので、そこら辺は 詳細に遷移させて見させたほうがよさそう？ GitHub のアクティビティ みたいな感じでコンパクトな表現があれば一覧に出してもいいかも。 あとは 5日未消化時みたいな要アクションのインジケータとか。

Changes

1 changed files (+89/-1)

• demo/src/Main.elm
  • @@ -64,6 +64,7 @@ type Route
    | EmployerHome | AdminHome | WorkerSchedule User Editability + | WorkersList User | NotFound
  • @@ -78,12 +79,20 @@ routeParser =
    , Url.Parser.map (WorkerSchedule Worker Readonly) (Url.Parser.s "worker" </> Url.Parser.s "schedule") , Url.Parser.map (WorkerSchedule Worker ReadWrite) (Url.Parser.s "worker" </> Url.Parser.s "schedule-mutable") , Url.Parser.map (WorkerSchedule Employer ReadWrite) (Url.Parser.s "employer" </> Url.Parser.s "worker-schedule") + , Url.Parser.map (WorkersList Employer) (Url.Parser.s "employer" </> Url.Parser.s "workers") ] + type alias WorkerInfo = + { displayName : String + , properties : List ( String, String ) + } + + type alias Model = { route : Route , key : Browser.Navigation.Key + , workers : List WorkerInfo }
  • @@ -91,6 +100,20 @@ init : Flags -> Url.Url -> Browser.Navigation.Key -> ( Model, Cmd Msg )
    init _ url key = ( { route = Url.Parser.parse routeParser url |> Maybe.withDefault NotFound , key = key + , workers = + [ { displayName = "田中 太郎" + , properties = + [ ( "部署", "介護事業部" ) + , ( "役職", "課長" ) + ] + } + , { displayName = "山田 花子" + , properties = + [ ( "部署", "介護事業部" ) + , ( "役職", "パート" ) + ] + } + ] } , Cmd.none )
  • @@ -188,7 +211,7 @@ view model =
    [ Html.h1 [] [ text "株式会社XXX 有給休暇管理システム" ] , Html.dl [] [ Html.dt [] - [ Html.a [ href "#" ] [ text "労働者の一覧を見る" ] ] + [ Html.a [ href "employer/workers" ] [ text "労働者の一覧を見る" ] ] , Html.dd [] [ text "システムに登録されている労働者の閲覧や変更を行う画面に移動します。" ] , Html.dt []
  • @@ -308,6 +331,70 @@ view model =
    ] } + WorkersList _ -> + { title = "労働者一覧 | Yamori デモ" + , body = + [ Html.h1 [] [ text "労働者の一覧" ] + , Html.p [] [ text "あなたに編集権限のある労働者の一覧です。" ] + , Html.ul + [ style "padding" "0 1em" ] + (List.map + (\worker -> + Html.li + [ style "margin" "2em 0" ] + [ Html.span [] [ text worker.displayName ] + , Html.dl + [ style "margin" "1em 0" ] + (List.foldl + (\( key, value ) nodes -> + nodes + ++ [ Html.dt + [ style "font-weight" "bold" + , style "margin-top" "1em" + , style "font-size" "0.9em" + ] + [ text key ] + , Html.dd + [ style "margin" "0" ] + [ text value ] + ] + ) + [] + worker.properties + ) + , Html.div + [] + [ Html.button [] [ text "編集" ] + , Html.button [] [ text "削除" ] + ] + ] + ) + model.workers + ) + , Html.div + [ style "border" "1px solid currentColor" + , style "padding" "1em" + , style "margin" "0.5em" + ] + [ Html.h2 [] [ text "デモ用メモ" ] + , Html.p [] + [ Html.small [] + [ text "役職や部署といった属性は \"属性名 = 値\" の自由な形式で、" + , text "それを基にサービス提供側もしくは管理者が権限管理ロジックを独立したプラグイン" + , text "として作成する。実際のところは 99% 前者が行うことになるであろうが。" + , text "これにより組織ごとに柔軟にカスタマイズされた権限管理を行うことができる。" + ] + ] + , Html.p [] + [ Html.small [] + [ text "例えば、介護事業部の労働者のみを管理できる使用者ユーザを作ったり、" + , text "事業所という属性を追加して特定の事業所に絞るといった具合。" + ] + ] + ] + ] + } + DemoIndex -> { title = "Yamori デモ 画面選択" , body =
  • @@ -318,6 +405,7 @@ view model =
    , Html.li [] [ Html.a [ href "/worker/schedule-mutable" ] [ text "労働者予定一覧 (編集権限あり)" ] ] , Html.li [] [ Html.a [ href "/employer" ] [ text "使用者ホーム" ] ] , Html.li [] [ Html.a [ href "/employer/worker-schedule" ] [ text "使用者から見た労働者予定一覧" ] ] + , Html.li [] [ Html.a [ href "/employer/workers" ] [ text "労働者一覧（労働者はアクセス不可）" ] ] , Html.li [] [ Html.a [ href "/admin" ] [ text "管理者ホーム" ] ] ] ]