Advertisement
Guest User

Untitled

a guest
Feb 22nd, 2017
170
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. (ns app.ui
  2.   (:require [om.next :as om :refer-macros [defui]]
  3.             [untangled.client.mutations :as mut]
  4.             [untangled.client.core :as uc]
  5.             [om.dom :as dom]
  6.             [om.next :as om :refer-macros [defui]]))
  7.  
  8. (def example-state
  9. {:workers/by-id
  10.  {1
  11.   {:worker/id 1,
  12.    :worker/first-name "Teja",
  13.    :worker/last-name "Metrovsek",
  14.    :worker/nick-name "TejaM"},
  15.   2
  16.   {:worker/id 2,
  17.    :worker/first-name "Timotej",
  18.    :worker/last-name "Zgolec",
  19.    :worker/nick-name "TimotejZ"},
  20.   3
  21.   {:worker/id 3,
  22.    :worker/first-name "Rok",
  23.    :worker/last-name "Stroven",
  24.    :worker/nick-name "RokS"},
  25.   4
  26.   {:worker/id 4,
  27.    :worker/first-name "Anja",
  28.    :worker/last-name "Maston",
  29.    :worker/nick-name "AnjaM"},
  30.   5
  31.   {:worker/id 5,
  32.    :worker/first-name "Zoja",
  33.    :worker/last-name "Kolovin",
  34.    :worker/nick-name "ZojaK"}},
  35.  :workers/table
  36.  {:workers
  37.   [[:workers/by-id 1]
  38.    [:workers/by-id 2]
  39.    [:workers/by-id 3]
  40.    [:workers/by-id 4]
  41.    [:workers/by-id 5]]},
  42.  :ui/locale "en-US"})
  43.  
  44. (defui ^:once WorkerRow
  45.   static om/IQuery
  46.   ;(query [this] [:worker/id :worker/first-name :worker/last-name :worker/nick-name])
  47.   (query [this] '[:worker/id :worker/first-name :worker/last-name :worker/nick-name])
  48.   static om/Ident
  49.   (ident [_ props] [:workers/by-id (:worker/id props)])
  50.   Object
  51.   (render [this]
  52.     (let [{:keys [worker/id worker/first-name worker/last-name worker/nick-name]} (om/props this)]
  53.       (dom/tr nil
  54.         (dom/td nil id)
  55.         (dom/td nil first-name)
  56.         (dom/td nil last-name)
  57.         (dom/td nil nick-name)))))
  58.  
  59. (def ui-worker-row (om/factory WorkerRow {:keyfn :worker/id}))
  60.  
  61. (defui ^:once WorkersTable
  62.   static om/IQuery
  63.   (query [this] `[{:workers ~(om/get-query WorkerRow)}])
  64.   static om/Ident
  65.   (ident [this params] [:workers/table])
  66.   Object
  67.   (render [this]
  68.     (let [{:keys [workers]} (om/props this)]
  69.       (dom/div nil
  70.         (dom/table nil
  71.           (dom/thead nil
  72.             (dom/tr nil
  73.               (dom/th nil "First name")
  74.               (dom/th nil "Last name")
  75.               (dom/th nil "Nick name")))
  76.           (dom/tbody nil
  77.             (map ui-worker-row workers)))))))
  78.  
  79. (def ui-worker-table (om/factory WorkersTable))
  80.  
  81. ;{:workers/table [{:workers [:worker/id :worker/first-name :worker/last-name :worker/nick-name]}]}
  82. ;; A UI node, with a co-located query of app state and a definition of the application's initial state.
  83. ;; The `:once` metadata ensures that figwheel does not redefine the static component with each re-render
  84. (defui ^:once Root
  85.   ;static uc/InitialAppState
  86.   ;(initial-state [clz params] {:list (uc/initial-state MyList {})})
  87.   static om/IQuery
  88.   (query [this] `[:ui/react-key {:workers/table ~(om/get-query WorkersTable)}])
  89.   Object
  90.   (render [this]
  91.     (let [{:keys [ui/react-key] table-workers :workers/table} (om/props this)]
  92.       (println (:workers/table (om/props this)))
  93.       (dom/div #js {:key react-key}
  94.         (dom/h4 nil "Header")
  95.         (ui-worker-table table-workers)))))
  96.  
  97. (defonce app (atom (uc/new-untangled-client :initial-state example-state)))
  98.  
  99. (swap! app uc/mount Root "app")
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement