update

src/App.vue

@@ -41,7 +41,7 @@
     },
     computed: {
       login: function () {
-        return !!this.$store.state.user
+        return !!this.$store.state.account
       }
     }
   }

src/filters/index.js

@@ -1,3 +0,0 @@
-/**
- * Created by cauchywei on 16/10/11.
- */

src/router/index.js

@@ -1,14 +1,11 @@
 import Vue from 'vue'
 import Router from 'vue-router'
+
 import LoginView from '../views/Login.vue'
 import HomeView from '../views/Home.vue'
 
 Vue.use(Router)
 
-// import { createListView } from '../views/CreateListView'
-// import ItemView from '../views/ItemView.vue'
-// import UserView from '../views/UserView.vue'
-
 var router = new Router({
   mode: 'history',
   scrollBehavior: () => ({y: 0}),

src/service/index.js

@@ -5,7 +5,7 @@
 import mockAxios from './mock'
 import prodAxios from './prod'
 
-const env = 'mock'
+const env = 'prod'
 const axios = env === 'mock' ? mockAxios : prodAxios
 
 export function login (username, password) {
@@ -38,18 +38,18 @@ export function register (data) {
   })
 }
 
-export function searchBook (name) {
-  const params = {
-    'ISBN': name,
-    'name': name,
-  }
-  const form = new FormData()
-  form.append('ISBN', name)
-  form.append('name', 'name')
+export function searchBook(params) {
+  return axios.get('/books/search', {
+    params: params
+  });
+}
 
-  return axios({
-    method: 'get',
-    url: '/books/search',
+export function getProfile() {
+  return axios.get('/users/self/');
+}
+
+export function setProfile(form) {
+  return axios.post('/books/self/', {
     data: form
-  })
+  });
 }

src/service/mock/index.js

@@ -1,14 +1,11 @@
-/**
- * Created by cauchywei on 16/10/11.
- */
 import axios from 'axios'
 import MockAdapter from 'axios-mock-adapter'
 
 var instance = axios.create()
 const mock = new MockAdapter(instance)
 
 mock.onPost('/users/login').reply(200, {
-  role: 'reader',
+  role: 'READER',
   id: 1,
   username: 'cauchywei',
   name: 'Wei Qin',
@@ -17,11 +14,11 @@ mock.onPost('/users/login').reply(200, {
   major: 'CS',
   phone: '23333',
   email: '[email protected]',
-  remarks: []
+  remarks: 'hi'
 })
 
-mock.onGet('/test').reply(200, {
-  role: 'reader',
+mock.onGet('/users/self/').reply(200, {
+  role: 'READER',
   id: 1,
   username: 'cauchywei',
   name: 'Wei Qin',
@@ -30,7 +27,7 @@ mock.onGet('/test').reply(200, {
   major: 'CS',
   phone: '23333',
   email: '[email protected]',
-  remarks: []
+  remarks: 'hi'
 })
 
 export default instance

src/service/prod/index.js

@@ -1,16 +1,13 @@
-/**
- * Created by cauchywei on 16/10/11.
- */
 import axios from 'axios'
 
 export function serviceUrl () {
-  return 'http://localhsot:8080/api/'
+  return 'http://xupu.name:6001/'
 }
 
 const instance = axios.create({
   baseURL: serviceUrl(),
   timeout: 1000,
   headers: {'X-Custom-Header': 'foobar'}
-})
+});
 
 export default instance

src/store/index.js

@@ -7,20 +7,31 @@ import Vuex from 'vuex'
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
+
   state: {
-    user: null
+    account: null,
+    searchBooks: null,
+    records: null,
+    books: null,
+    users: null
   },
+
   actions: {
-    ON_LOGIN: ({commit, dispatch, state}, user) => {
+    ON_LOGIN: ({commit, dispatch, state}, account) => {
       // commit('SET_ACTIVE_TYPE', {username,password})
-      commit('SET_LOGIN', user)
+      commit('SET_LOGIN', account)
       return Promise.resolve()
     },
 
     LOGOUT: ({commit, dispatch, state}) => {
       // commit('SET_ACTIVE_TYPE', {username,password})
       commit('SET_LOGOUT')
       return Promise.resolve()
+    },
+
+    ON_SEARCH: ({ commit, dispatch, state }, { books }) => {
+      commit('SET_SEARCH_BOOKS', books);
+      return Promise.resolve()
     }
     // // ensure data for rendering given list type
     // FETCH_LIST_DATA: ({ commit, dispatch, state }, { type }) => {
@@ -57,11 +68,15 @@ const store = new Vuex.Store({
   mutations: {
 
     SET_LOGOUT: (state) => {
-      state.user = null
+      state.account = null
+    },
+
+    SET_LOGIN: (state, account) => {
+      state.account = account
     },
 
-    SET_LOGIN: (state, user) => {
-      state.user = user
+    SET_SEARCH_BOOKS: (state, { books }) => {
+      state.searchBooks = books
     }
 
     // SET_ACTIVE_TYPE: (state, { type }) => {

src/views/Home.vue

@@ -3,14 +3,14 @@
     <input class="input-search"
            autofocus autocomplete="off"
            placeholder="Search books here"
-           v-model="search-input"
-           @keyup.enter="addTodo" />
-    <section class="main" v-show="books.length" v-cloak>
+           v-model="searchInput"
+           @keyup.enter="search"/>
+    <section class="main" v-show="searchBooks.length" v-cloak>
       <ul class="book-list">
-        <li v-for="book in books"
+        <li v-for="book in searchBooks"
             class="book"
             :key="book.ISBN"
-            :class="{ completed: book.completed, editing: todo == editedTodo }">
+            :class="{ }">
           <div class="view">
             <label>{{ book.ISBN }}</label>
             <label>{{ book.name }}</label>
@@ -24,26 +24,34 @@
 </template>
 
 <script>
-
   import * as service from '../service'
 
-  var bookStorage = {
-    fetch: function () {
-      var books = [] // JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]')
-      books.forEach(function (book, index) {
-        book.ISBN = index
-        book.name = index
-      })
-      bookStorage.count = books.length
-      return books
+  export default {
+    data() {
+      return {
+        searchBooks: [],
+        searchInput: ''
+      }
+    },
+    watch: {
     },
-    save: function (todos) {
-      // localStorage.setItem(STORAGE_KEY, JSON.stringify(todos))
+    methods: {
+      search: function() {
+        var value = this.searchInput && this.searchInput.trim()
+        if (!value) {
+          return
+        }
+        var params = {
+          'ISBN': name,
+          'name': name
+        };
+        service.searchBook(params).then(function (response) {
+          var data = response.data;
+          console.log(data);
+        })
+      }
     }
   }
-
-  export default {
-  }
 </script>
 
 <style scoped>

src/views/Login.vue

@@ -1,12 +1,9 @@
-/**
-* Created by cauchywei on 16/10/11.
-*/
 <template>
   <div id="login-panel">
     <form v-on:submit.prevent="login" id="login-form">
-      <input v-model="user.username" placeholder="username"/>
-      <input v-model="user.password" placeholder="password" type="password"/>
-      <button type="submit" class="action-button"> login</button>
+      <input v-model="account.username" placeholder="username" type="text"/>
+      <input v-model="account.password" placeholder="password" type="password"/>
+      <button type="submit" class="action-button">login</button>
     </form>
   </div>
 </template>
@@ -17,22 +14,22 @@
     el: '#login-panel',
     data () {
       return {
-        user: {
+        account: {
           username: '',
           password: ''
         },
-        data: {name: 'test'}
+        data: { name: 'test' }
       }
     },
     methods: {
       login () {
-        const length = this.user.username.length
+        const length = this.account.username.length
         if (length < 2 || length > 18) {
           alert("username's length must between 2~18")
           return
         }
         let self = this
-        service.login(this.username, this.password).then(function (response) {
+        service.login(this.account.username, this.account.password).then(function (response) {
           self.$store.dispatch('ON_LOGIN', response.data)
           self.$router.go(-1)
         }).catch(function (error) {