diff options
| author | mo khan <mo@mokhan.ca> | 2017-03-15 21:50:51 -0600 |
|---|---|---|
| committer | mo khan <mo@mokhan.ca> | 2017-03-15 21:50:51 -0600 |
| commit | 231a29f4fcac04dbf6ab4300e9af31ab5e74c7a1 (patch) | |
| tree | b1121c8659acb6666b07a28d4f2fa8893869bcfd | |
| parent | 5bef4d5d0ecc36c734bcf8f09e9bc5cf1f8c6a00 (diff) | |
enhance login with login component.
| -rw-r--r-- | app/assets/javascripts/views/sessions/new.js.coffee | 7 | ||||
| -rw-r--r-- | app/views/sessions/new.html.erb | 8 |
2 files changed, 12 insertions, 3 deletions
diff --git a/app/assets/javascripts/views/sessions/new.js.coffee b/app/assets/javascripts/views/sessions/new.js.coffee new file mode 100644 index 0000000..b7b040a --- /dev/null +++ b/app/assets/javascripts/views/sessions/new.js.coffee @@ -0,0 +1,7 @@ +Vue.component "login", + data: () -> + username: '' + password: '' + computed: + canSubmit: -> + @username.length > 0 && @password.length > 0 diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb index 205fd5f..fcde76f 100644 --- a/app/views/sessions/new.html.erb +++ b/app/views/sessions/new.html.erb @@ -1,24 +1,26 @@ <div class="container" data-autovue="login-view"> <div class="columns"> <div class="column is-6 is-offset-3"> + <login inline-template> <%= form_for @user, url: sessions_path do |f| %> <p class="control has-icon"> - <%= f.text_field :username, placeholder: t('.username'), class: 'input is-large', required: 'required' %> + <%= f.text_field :username, placeholder: t('.username'), class: 'input is-large', required: 'required', "v-model.trim": "username" %> <span class="icon is-small"> <i class="fa fa-envelope"></i> </span> </p> <p class="control has-icon"> - <%= f.password_field :password, placeholder: t('.password'), class: 'input is-large', required: 'required' %> + <%= f.password_field :password, placeholder: t('.password'), class: 'input is-large', required: 'required', "v-model.trim": "password" %> <span class="icon is-small"> <i class="fa fa-lock"></i> </span> </p> <p class="control"> - <%= f.submit t('.login_button'), class: "button is-success is-large is-fullwidth" %> + <%= f.submit t('.login_button'), class: "button is-success is-large is-fullwidth", ":disabled": "!canSubmit" %> <%= link_to t('.register_link'), new_registration_path, class: "button is-link is-pulled-right" %> </p> <% end %> + </login> </div> </div> </div> |