diff --git a/client/src/components/index/login.vue b/client/src/components/index/login.vue
index 026db81..3769acd 100644
--- a/client/src/components/index/login.vue
+++ b/client/src/components/index/login.vue
@@ -9,19 +9,19 @@
 				<i class="item-primary">account_circle</i>
 				<div class="item-content">
 					<div class="floating-label">
-						<input required class="full-width">
+						<input required class="full-width" v-model="user">
 						<label>Username</label>
 					</div>
 				</div>
 				<div class="item-content">
 					<div class="floating-label">
-						<input required class="full-width" type="password">
+						<input required class="full-width" type="password" v-model="pass">
 						<label>Password</label>
 					</div>
 				</div>
 				<div class="item-content">
 					<div class="floating-label">
-						<button class="primary">
+						<button class="primary" @click="doLogin()">
 							<i class="on-left">check_circle</i> Login
 						</button>
 					</div>
@@ -29,12 +29,27 @@
 			</div>
 		</div>
 
-
 	</div>
-</div>
 </template>
 
 <script>
+import api from '../../api'
+
+export default {
+	data () {
+		return {
+			user: '',
+			pass: '',
+			error: null
+		}
+	},
+
+	methods: {
+		doLogin: function () {
+			api.login(this, this.user, this.pass)
+		}
+	}
+}
 </script>
 
 <style lang="stylus">